/* 
 * zzz_local.css - Compact, responsive UI styles for EPrints workflow (PC & Mobile/HP)
 */

/* ========================================================
   1. LEGACY REPOSITORY STYLES (CLEANED)
   ======================================================== */
h2 {
  text-align: center;
}  

.ep_view_intro {
  text-align: center;
}

.search {
  margin: 0;
  width: 100%;
  border-collapse: collapse;
  box-shadow: 0 2px 3px 1px #ddd;
  overflow: hidden;
  border: 10px solid #fff;
  border-radius: 10px;
}

.search tbody tr {
  background: #eee;
  margin: 0 auto;
}

.container {
  margin-right: auto;
  margin-left: auto;
}

.ep_tm_header {
  background: #ffffff;
}

.ep_tm_logo {
  display: none;
}

.ep_tm_footer {
  clear: both;
  position: relative;
  margin-top: 20px;
  font-size: 80%;
  border-top-width: 2px;
  border-top-style: solid;
  padding: 10px 10px 0px 10px;
}

.ep_tm_footer hr {
  display: none;
}

.zebra-table {
  font-size: 12px;
  border-collapse: collapse;
  box-shadow: 0 2px 3px 1px #ddd;
  overflow: hidden;
  border: 10px solid #fff;
}

.zebra-table tbody tr:nth-child(odd) {
  background: #eee;
}

/* ========================================================
   2. WORKFLOW & EDIT PAGE: HEADER & TITLE ("Edit item:")
   ======================================================== */
#ep_page_header_wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0.5rem 1rem 0 1rem !important;
  box-sizing: border-box !important;
}

#ep_page_title,
.page-title {
  font-size: 0.96rem !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: #1e293b !important;
  margin: 0 0 0.5rem 0 !important;
  padding: 0.45rem 0.75rem !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-left: 4px solid #047857 !important;
  border-radius: 6px !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
}

#ep_page_title a,
.page-title a {
  color: #065f46 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

#ep_page_title a:hover,
.page-title a:hover {
  text-decoration: underline !important;
  color: #047857 !important;
}

.ep-edit-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #047857;
  color: #ffffff !important;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  padding: 2px 6px;
  border-radius: 4px;
  margin-right: 6px;
  vertical-align: middle;
}

/* ========================================================
   3. WORKFLOW CONTAINERS & TIGHT LAYOUT
   ======================================================== */
#ep_page_body_wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 1rem 1.5rem 1rem !important;
  box-sizing: border-box !important;
}

.ep_tm_page_content,
.ep_view_menu,
.ep_view_page {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0.7rem 0.9rem !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
}

/* ========================================================
   4. PROGRESS STEPPER BAR (CENTERED, COMPACT, NO ARROWS)
   ======================================================== */
.ep_blister_bar {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  white-space: nowrap !important;
  padding: 2px !important;
  margin: 0.15rem auto 0.45rem auto !important;
  max-width: 100% !important;
  width: 100% !important;
  border-spacing: 0 !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.ep_blister_bar::-webkit-scrollbar {
  height: 3px;
}
.ep_blister_bar::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
}

.ep_blister_bar > div {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 3px 5px !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 50px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  flex-shrink: 0 !important;
}

.ep_blister_bar > div > div {
  display: inline-flex !important;
  align-items: center !important;
}

/* Completely remove right arrow / join between blister buttons */
.ep_blister_join,
.ep_blister_bar > div > div.ep_blister_join {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  background-image: none !important;
  border: none !important;
  overflow: hidden !important;
}

.ep_blister_node,
.ep_blister_node_selected,
.ep_blister_node_completed {
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
  border-radius: 50px !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  outline: none !important;
  border: 1px solid transparent !important;
  text-decoration: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  min-width: 0 !important;
}

/* Active Step */
.ep_blister_node_selected {
  background: #047857 !important;
  color: #ffffff !important;
  border-color: #047857 !important;
  box-shadow: 0 1px 4px rgba(4, 120, 87, 0.25) !important;
}

/* Completed Step */
.ep_blister_node_completed {
  background: #ecfdf5 !important;
  color: #047857 !important;
  border-color: #a7f3d0 !important;
}
.ep_blister_node_completed:hover {
  background: #d1fae5 !important;
}

/* Upcoming Step */
.ep_blister_node {
  background: transparent !important;
  color: #64748b !important;
}
.ep_blister_node:hover {
  background: #e2e8f0 !important;
  color: #1e293b !important;
}

/* ========================================================
   5. ACTION BUTTONS BAR (PREVIOUS, SAVE, CANCEL, NEXT)
   ======================================================== */
.ep_form_button_bar {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 2px 0 !important;
  margin: 0.45rem 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.ep_form_action_button,
input[type="submit"].ep_form_action_button,
button.ep_form_action_button,
.ep_form_button_bar input[type="submit"],
.ep_form_button_bar button {
  background: #047857 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  line-height: 1.25 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  margin: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
}

.ep_form_action_button:hover,
.ep_form_button_bar input[type="submit"]:hover,
.ep_form_button_bar button:hover {
  background: #065f46 !important;
  box-shadow: 0 2px 6px rgba(4, 120, 87, 0.2) !important;
}

/* Internal form buttons (Upload, More input rows, Search, Clear, etc.) */
.ep_form_internal_button,
input[type="submit"].ep_form_internal_button,
button.ep_form_internal_button {
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  padding: 4px 10px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  border-radius: 5px !important;
  background: #047857 !important;
  color: #ffffff !important;
  border: 1px solid #047857 !important;
  cursor: pointer !important;
  margin: 2px 4px 2px 0 !important;
}

.ep_form_internal_button:hover {
  background: #065f46 !important;
}

/* ========================================================
   6. COMPONENT CARDS (.ep_sr_component) & SMALL ICONS
   ======================================================== */
.ep_sr_component {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  margin: 0.45rem 0 !important;
  overflow: hidden !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.ep_sr_component .ep_sr_title_bar {
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 5px 10px !important;
  box-shadow: none !important;
}

.ep_sr_component .ep_sr_title {
  color: #0f172a !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.ep_sr_component .ep_sr_content {
  padding: 8px 10px !important;
  border: none !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

.ep_sr_help,
.ep_multi_inline_help {
  font-size: 0.78rem !important;
  line-height: 1.35 !important;
  color: #475569 !important;
  margin-bottom: 6px !important;
}

.ep_sr_collapse_bar {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  padding: 5px 10px !important;
  margin: 0.35rem 0 !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.ep_sr_collapse_bar a {
  color: #1e293b !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

/* Shrink all small UI icons (required star, help ?, +/-, up/down arrows) */
img.ep_required {
  width: 12px !important;
  height: 12px !important;
  vertical-align: middle !important;
  margin-right: 3px !important;
}

.ep_sr_show_help img,
.ep_sr_hide_help img,
.ep_multi_help img,
.ep_sr_collapse_bar img,
.ep_sr_collapse_bar input[type="image"] {
  width: 14px !important;
  height: 14px !important;
  vertical-align: middle !important;
}

.ep_form_input_grid_arrows input[type="image"],
.ep_form_input_grid_arrows img {
  width: 14px !important;
  height: 14px !important;
  vertical-align: middle !important;
  margin: 0 1px !important;
}

/* ========================================================
   7. UPLOAD STAGE (ADD DOCUMENT & DOCUMENT CARDS)
   ======================================================== */
/* Tab Bar (File / From URL) */
.ep_tab_bar {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 4px !important;
  border-bottom: 1px solid #cbd5e1 !important;
}

.ep_tab_bar li {
  float: none !important;
  flex: 1 1 50% !important;
  max-width: 50% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  box-sizing: border-box !important;
}

.ep_tab_bar li a,
.ep_tab_bar li:first-child a {
  margin: 0 !important;
  padding: 5px 8px !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  border-radius: 6px 6px 0 0 !important;
  border: 1px solid #cbd5e1 !important;
  border-bottom: none !important;
  background: #f1f5f9 !important;
  color: #475569 !important;
  display: block !important;
  text-align: center !important;
}

.ep_tab_bar li.ep_tab_selected a {
  background: #ffffff !important;
  color: #047857 !important;
  border-top: 2px solid #047857 !important;
  margin-bottom: -1px !important;
}

.ep_tab_panel {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 8px 10px !important;
  border: 1px solid #cbd5e1 !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.UploadMethod_file_container,
.ep_tab_panel .ep_block {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

.ep_upload_file_label {
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  margin: 0 !important;
  color: #1e293b !important;
}

input[type="file"] {
  max-width: 100% !important;
  width: auto !important;
  font-size: 0.78rem !important;
  box-sizing: border-box !important;
}

/* Uploaded Document Card (.ep_upload_doc) */
.ep_upload_doc {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  margin: 6px 0 !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  overflow: hidden !important;
}

.ep_upload_doc_title_bar {
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 6px 8px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.ep_upload_doc_title_bar_inner {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.ep_upload_doc_title_bar_inner > div {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.ep_upload_doc_title_bar_inner_left {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 180px !important;
  min-width: 0 !important;
  width: auto !important;
}

.ep_upload_doc_icon_info {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
}

.ep_upload_doc_icon_info > div:first-child {
  flex-shrink: 0 !important;
}

.ep_upload_doc_icon_info img {
  max-width: 40px !important;
  max-height: 50px !important;
  width: auto !important;
  height: auto !important;
  border-radius: 4px !important;
  border: 1px solid #cbd5e1 !important;
  display: block !important;
}

.ep_upload_doc_icon_info > div.ep_upload_doc_title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  font-size: 0.8rem !important;
  line-height: 1.35 !important;
  color: #1e293b !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

.ep_upload_doc_actions,
.ep_upload_doc_title_bar_inner > div > div:last-child {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: auto !important;
  flex-shrink: 0 !important;
  margin-left: auto !important;
}

.ep_upload_doc_actions_inner,
.ep_upload_doc_actions_inner > div {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
}

.ep_upload_doc_actions_inner > div > div {
  display: inline-flex !important;
  padding: 0 !important;
}

/* Shrink Document Action Icons (Gears, Convert, Files, Delete) */
input.ep_form_action_icon,
.ep_upload_doc_actions input[type="image"],
.ep_upload_doc_actions img {
  width: 22px !important;
  height: 22px !important;
  padding: 2px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
  object-fit: contain !important;
  cursor: pointer !important;
}

input.ep_form_action_icon:hover {
  border-color: #047857 !important;
  background: #ecfdf5 !important;
}

/* Show / Hide options bar in Document Card */
.ep_upload_doc_expansion_bar {
  padding: 3px 8px !important;
  background: #f1f5f9 !important;
  border-bottom: 1px solid #e2e8f0 !important;
  text-align: right !important;
}

.ep_update_doc_options {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: #334155 !important;
}

.ep_update_doc_options label {
  cursor: pointer !important;
  margin: 0 !important;
}

.ep_update_doc_options input[type="image"],
.ep_update_doc_options img {
  width: 12px !important;
  height: 12px !important;
  vertical-align: middle !important;
}

.ep_upload_doc_content {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 4px 6px !important;
}

/* ========================================================
   8. MULTI-FIELD TABLES (.ep_multi & .ep_upload_fields)
   ======================================================== */
.ep_multi,
.ep_upload_fields.ep_multi {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.ep_multi .ep_table_row > div,
.ep_upload_fields .ep_table_row > div {
  padding: 5px 8px !important;
  vertical-align: middle !important;
  border-top: 1px dashed #e2e8f0 !important;
}

.ep_multi .ep_table_row.ep_first > div,
.ep_upload_fields .ep_table_row:first-child > div {
  border-top: none !important;
}

.ep_multi_heading,
.ep_multi_heading_legend {
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  color: #334155 !important;
  border-right: 1px dashed #e2e8f0 !important;
  width: 145px !important;
}

.ep_multi_input {
  font-size: 0.8rem !important;
}

.ep_multi_input select:not([id$="_month"]):not([id$="_day"]),
.ep_multi_input input[type="text"]:not([size="2"]):not([size="4"]):not([size="6"]) {
  width: 100% !important;
  max-width: 480px !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* ========================================================
   9. FORM INPUTS: TITLE & ABSTRACT (FULL WIDTH)
   ======================================================== */
div:has(> #title_cell_0_0),
div:has(> #abstract_cell_0_0),
#title_cell_0_0,
#abstract_cell_0_0,
textarea#title,
textarea#abstract,
.ep_eprint_title,
.ep_eprint_abstract {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
}

.ep_sr_component:has(textarea) .ep_form_input_grid,
.ep_form_input_grid:has(textarea),
.ep_form_input_grid:has(textarea) > div,
.ep_form_input_grid:has(textarea) > div > div {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
}

textarea#title,
textarea#abstract,
.ep_eprint_title,
.ep_eprint_abstract {
  padding: 7px 10px !important;
  font-size: 0.86rem !important;
  line-height: 1.45 !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  background-color: #ffffff !important;
  color: #1e293b !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  font-family: inherit !important;
}

textarea#title:focus,
textarea#abstract:focus,
.ep_eprint_title:focus,
.ep_eprint_abstract:focus {
  border-color: #047857 !important;
  box-shadow: 0 0 0 2px rgba(4, 120, 87, 0.15) !important;
  outline: none !important;
}

/* Abstract Toggle Button */
.ep-abstract-toggle-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-top: 4px !important;
  padding: 4px 10px !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  color: #047857 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  border-radius: 5px !important;
  cursor: pointer !important;
}

.ep-abstract-toggle-btn:hover {
  background: #d1fae5 !important;
  color: #065f46 !important;
}

/* ========================================================
   10. SUPERVISOR FORM & STANDARD INPUTS
   ======================================================== */
.ep-supervisor-vertical-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.ep-supervisor-vertical-form label {
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  color: #1e293b !important;
  margin-bottom: 1px !important;
  display: block !important;
}

.ep-supervisor-vertical-form input[type="text"] {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: block !important;
  padding: 6px 10px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  font-size: 0.84rem !important;
}

/* Multi-column compound tables (Creators, Contributors) */
.ep_compound,
.ep_compound_list,
.ep_compound_list > div,
.ep_sr_content > table {
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

.ep_form_input_grid th,
.ep_form_input_grid > div > div.heading,
.ep_compound_header_cell {
  font-size: 0.76rem !important;
  color: #475569 !important;
  font-weight: 600 !important;
  padding: 2px 4px !important;
}

.ep_form_input_grid > div > div {
  padding: 2px 3px !important;
  vertical-align: middle !important;
}

/* Modern compact standard inputs */
input[type="text"],
input[type="password"],
select {
  border: 1px solid #cbd5e1 !important;
  border-radius: 5px !important;
  padding: 5px 8px !important;
  font-size: 0.82rem !important;
  color: #1e293b !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

input[type="text"]:focus,
select:focus {
  border-color: #047857 !important;
  box-shadow: 0 0 0 2px rgba(4, 120, 87, 0.15) !important;
  outline: none !important;
}

/* ========================================================
   11. RADIO & CHECKBOX ALIGNMENT (ITEM TYPE & THESIS TYPE)
   ======================================================== */
/* Format A: Thesis Type, Thesis Name (input in dt, label in dd) */
dl.ep_field_set_medium,
dl.ep_boolean_list {
  display: grid !important;
  grid-template-columns: 18px auto !important;
  align-items: center !important;
  justify-content: start !important;
  row-gap: 4px !important;
  column-gap: 6px !important;
  margin: 2px 0 !important;
  padding: 0 !important;
  width: auto !important;
}

dl.ep_field_set_medium > dt,
dl.ep_boolean_list > dt {
  float: none !important;
  clear: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 18px !important;
  height: 18px !important;
}

dl.ep_field_set_medium > dd,
dl.ep_boolean_list > dd {
  float: none !important;
  clear: none !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 18px !important;
  line-height: 1.25 !important;
}

dl.ep_field_set_medium label,
dl.ep_boolean_list label {
  cursor: pointer !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.82rem !important;
  color: #1e293b !important;
  line-height: 1.25 !important;
}

/* Format B: Item Type (input + text in dt) */
dl.ep_field_set_long {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
  gap: 4px 8px !important;
  margin: 2px 0 !important;
  padding: 0 !important;
}

dl.ep_field_set_long > dt {
  float: none !important;
  clear: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 4px 8px !important;
  width: auto !important;
  height: auto !important;
  min-height: 24px !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  color: #1e293b !important;
  cursor: pointer !important;
  border-radius: 5px !important;
  border: 1px solid #f1f5f9 !important;
  background: #f8fafc !important;
  box-sizing: border-box !important;
}

dl.ep_field_set_long > dt:hover {
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

dl.ep_field_set_long > dt:has(input:checked) {
  background: #ecfdf5 !important;
  border-color: #047857 !important;
  color: #047857 !important;
  font-weight: 600 !important;
}

dl.ep_field_set_long > dd {
  float: none !important;
  clear: none !important;
  margin: 1px 0 4px 22px !important;
  padding: 0 !important;
  font-size: 0.75rem !important;
  color: #64748b !important;
  line-height: 1.3 !important;
  grid-column: 1 / -1 !important;
}

dl.ep_field_set_long > dd:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

input[type="radio"],
input[type="checkbox"] {
  accent-color: #047857 !important;
  cursor: pointer !important;
  vertical-align: middle !important;
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
}

/* ========================================================
   12. SUBJECTS & DIVISIONS TREE (COMPACT & FOLDABLE)
   ======================================================== */
div.ep_subjectinput_tree {
  margin-left: 0 !important;
  max-height: 380px !important;
  overflow-y: auto !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  background: #ffffff !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.ep_subjectinput_tree dl {
  display: block !important;
  margin: 1px 0 1px 14px !important;
  padding: 0 !important;
}

.ep_subjectinput_tree > dl {
  margin-left: 0 !important;
}

.ep_subjectinput_tree dt {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  margin: 2px 0 !important;
  line-height: 1.3 !important;
  font-size: 0.8rem !important;
  color: #1e293b !important;
  width: auto !important;
}

/* Category nodes with children: 24px padding so text NEVER touches plus icon */
.ep_subjectinput_tree dt.ep_subjectinput_tree {
  cursor: pointer !important;
  padding: 3px 6px 3px 24px !important;
  background-position: 4px center !important;
  background-repeat: no-repeat !important;
  background-size: 13px 13px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  border-radius: 4px !important;
}

.ep_subjectinput_tree dt.ep_subjectinput_tree:hover {
  background-color: #f1f5f9 !important;
  color: #047857 !important;
}

/* Leaf nodes without children (contain [Add] button) */
.ep_subjectinput_tree dt:not(.ep_subjectinput_tree) {
  gap: 6px !important;
  padding: 2px 4px 2px 24px !important;
}

.ep_subjectinput_tree dd {
  margin: 0 !important;
  padding: 0 !important;
}

.ep_subjectinput_add_button,
.ep_subjectinput_remove_button,
input[type="submit"].ep_subjectinput_add_button,
input[type="submit"].ep_subjectinput_remove_button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 2px 6px !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  border: none !important;
  line-height: 1.15 !important;
  flex-shrink: 0 !important;
  margin: 0 3px 0 0 !important;
  min-width: 0 !important;
}

.ep_subjectinput_add_button,
input[type="submit"].ep_subjectinput_add_button {
  background: #047857 !important;
  color: #ffffff !important;
}

.ep_subjectinput_remove_button,
input[type="submit"].ep_subjectinput_remove_button {
  background: #ef4444 !important;
  color: #ffffff !important;
}

/* Subject Search Bar */
.ep_subjectinput_searchbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 6px 0 8px 0 !important;
  padding: 6px 8px !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  font-size: 0.8rem !important;
}

.ep_subjectinput_searchbar input[type="text"] {
  flex: 1 1 160px !important;
  max-width: 280px !important;
  padding: 4px 8px !important;
  font-size: 0.8rem !important;
}

/* Subject Selections Box */
.ep_subjectinput_selections {
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  margin-bottom: 8px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  font-size: 0.8rem !important;
}

.ep_subjectinput_selections td,
.ep_subjectinput_selections > div > div {
  border: none !important;
  padding: 2px 6px !important;
  font-size: 0.8rem !important;
}

/* ========================================================
   13. MOBILE RESPONSIVENESS (HP / max-width: 768px)
   ======================================================== */
@media (max-width: 768px) {
  #ep_page_header_wrapper {
    padding: 0.35rem 0.35rem 0 0.35rem !important;
  }
  #ep_page_body_wrapper {
    padding: 0 0.35rem 1rem 0.35rem !important;
  }
  .ep_tm_page_content,
  .ep_view_menu,
  .ep_view_page {
    padding: 0.45rem 0.4rem !important;
    border-radius: 6px !important;
  }
  #ep_page_title,
  .page-title {
    font-size: 0.82rem !important;
    line-height: 1.3 !important;
    padding: 0.35rem 0.55rem !important;
    margin-bottom: 0.35rem !important;
  }
  .ep-edit-badge {
    font-size: 0.64rem !important;
    padding: 1px 5px !important;
    margin-right: 4px !important;
  }

  /* Blister bar on HP: compact, 1 line, no arrows */
  .ep_blister_bar {
    padding: 1px !important;
    margin: 0.1rem auto 0.35rem auto !important;
  }
  .ep_blister_bar > div {
    padding: 2px 4px !important;
    gap: 2px !important;
  }
  .ep_blister_node,
  .ep_blister_node_selected,
  .ep_blister_node_completed {
    font-size: 0.7rem !important;
    padding: 3px 7px !important;
  }

  /* Action buttons on HP: 1 SINGLE ROW within 1 screen! */
  .ep_form_button_bar {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 3px !important;
    margin: 0.35rem 0 !important;
    padding: 2px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .ep_form_button_bar input[type="submit"],
  .ep_form_button_bar button,
  .ep_form_button_bar .ep_form_action_button {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    padding: 5px 3px !important;
    font-size: 0.68rem !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
    min-height: 27px !important;
    white-space: nowrap !important;
    text-align: center !important;
    border-radius: 4px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Component cards on HP */
  .ep_sr_component {
    margin: 0.35rem 0 !important;
    border-radius: 5px !important;
  }
  .ep_sr_component .ep_sr_title_bar {
    padding: 4px 8px !important;
  }
  .ep_sr_component .ep_sr_title {
    font-size: 0.78rem !important;
  }
  .ep_sr_component .ep_sr_content {
    padding: 6px 6px !important;
  }
  .ep_sr_help,
  .ep_multi_inline_help {
    font-size: 0.72rem !important;
    margin-bottom: 4px !important;
  }
  .ep_sr_collapse_bar {
    padding: 4px 8px !important;
    margin: 0.25rem 0 !important;
    font-size: 0.75rem !important;
  }

  /* Smaller icons on HP so nothing overflows */
  img.ep_required {
    width: 10px !important;
    height: 10px !important;
  }
  .ep_sr_show_help img,
  .ep_sr_hide_help img,
  .ep_multi_help img,
  .ep_sr_collapse_bar img,
  .ep_sr_collapse_bar input[type="image"] {
    width: 12px !important;
    height: 12px !important;
  }

  /* Upload box & Document cards on HP */
  .ep_tab_bar li a,
  .ep_tab_bar li:first-child a {
    padding: 4px 6px !important;
    font-size: 0.74rem !important;
  }
  .ep_tab_panel {
    padding: 6px 6px !important;
  }
  .ep_upload_file_label {
    font-size: 0.74rem !important;
    width: 100% !important;
  }
  input[type="file"] {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 0.72rem !important;
  }
  .ep_upload_doc_title_bar {
    padding: 5px 6px !important;
  }
  .ep_upload_doc_title_bar_inner_left {
    flex: 1 1 130px !important;
  }
  .ep_upload_doc_icon_info {
    gap: 6px !important;
  }
  .ep_upload_doc_icon_info img {
    max-width: 30px !important;
    max-height: 38px !important;
  }
  .ep_upload_doc_icon_info > div.ep_upload_doc_title {
    font-size: 0.72rem !important;
    line-height: 1.25 !important;
  }
  .ep_upload_doc_actions_inner,
  .ep_upload_doc_actions_inner > div {
    gap: 3px !important;
  }
  input.ep_form_action_icon,
  .ep_upload_doc_actions input[type="image"],
  .ep_upload_doc_actions img {
    width: 18px !important;
    height: 18px !important;
    padding: 1px !important;
  }
  .ep_update_doc_options {
    font-size: 0.7rem !important;
  }
  .ep_update_doc_options input[type="image"],
  .ep_update_doc_options img {
    width: 11px !important;
    height: 11px !important;
  }
  .ep_upload_doc_content {
    padding: 3px 4px !important;
  }

  /* Multi-field tables (.ep_multi & .ep_upload_fields) on HP: flex layout, ZERO overflow */
  .ep_multi,
  .ep_upload_fields.ep_multi {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .ep_multi .ep_table_row,
  .ep_upload_fields .ep_table_row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 4px 6px !important;
    padding: 4px 2px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-top: 1px dashed #e2e8f0 !important;
  }
  .ep_multi .ep_table_row.ep_first,
  .ep_upload_fields .ep_table_row:first-child {
    border-top: none !important;
  }
  .ep_multi .ep_table_row > div,
  .ep_upload_fields .ep_table_row > div {
    border-top: none !important;
    padding: 0 !important;
  }
  .ep_multi .ep_multi_heading,
  .ep_multi .ep_multi_heading_legend,
  .ep_upload_fields .ep_multi_heading {
    display: flex !important;
    align-items: center !important;
    flex: 0 0 78px !important;
    width: 78px !important;
    font-size: 0.72rem !important;
    line-height: 1.2 !important;
    text-align: left !important;
    border-right: none !important;
    padding: 0 !important;
    color: #334155 !important;
  }
  .ep_multi .ep_multi_input,
  .ep_upload_fields .ep_multi_input {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 4px !important;
    flex: 1 1 calc(100% - 102px) !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0 !important;
    border: none !important;
    box-sizing: border-box !important;
    font-size: 0.74rem !important;
  }
  .ep_multi .ep_multi_input select:not([id$="_month"]):not([id$="_day"]),
  .ep_multi .ep_multi_input input[type="text"]:not([size="2"]):not([size="4"]):not([size="6"]),
  .ep_multi .ep_multi_input textarea,
  .ep_upload_fields .ep_multi_input select,
  .ep_upload_fields .ep_multi_input input[type="text"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    font-size: 0.74rem !important;
    padding: 4px 6px !important;
    margin: 0 !important;
  }
  .ep_multi .ep_multi_help,
  .ep_upload_fields .ep_multi_help {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    padding: 0 !important;
    border: none !important;
  }
  .ep_multi .ep_table_cell:empty,
  .ep_upload_fields .ep_table_cell:empty {
    display: none !important;
  }

  /* Item Type & Radio buttons on HP */
  dl.ep_field_set_long {
    grid-template-columns: 1fr !important;
    gap: 3px !important;
  }
  dl.ep_field_set_long > dt {
    font-size: 0.76rem !important;
    padding: 3px 6px !important;
    min-height: 22px !important;
  }
  dl.ep_field_set_medium label,
  dl.ep_boolean_list label {
    font-size: 0.76rem !important;
  }
  input[type="radio"],
  input[type="checkbox"] {
    width: 13px !important;
    height: 13px !important;
  }

  /* Inputs & Textareas standard text on HP */
  input[type="text"],
  input[type="password"],
  select,
  textarea {
    font-size: 0.76rem !important;
    padding: 4px 6px !important;
  }
  textarea#title,
  textarea#abstract,
  .ep_eprint_title,
  .ep_eprint_abstract {
    font-size: 0.78rem !important;
    line-height: 1.4 !important;
    padding: 6px 8px !important;
  }
  .ep-abstract-toggle-btn {
    font-size: 0.72rem !important;
    padding: 3px 8px !important;
  }

  /* Supervisor & Subject Tree on HP */
  .ep-supervisor-vertical-form {
    gap: 6px !important;
  }
  .ep-supervisor-vertical-form label {
    font-size: 0.74rem !important;
  }
  .ep-supervisor-vertical-form input[type="text"] {
    font-size: 0.76rem !important;
    padding: 5px 8px !important;
  }
  div.ep_subjectinput_tree {
    padding: 4px 6px !important;
    max-height: 320px !important;
  }
  .ep_subjectinput_tree dl {
    margin-left: 10px !important;
  }
  .ep_subjectinput_tree dt {
    font-size: 0.74rem !important;
  }
  .ep_subjectinput_tree dt.ep_subjectinput_tree {
    padding: 2px 4px 2px 20px !important;
    background-size: 11px 11px !important;
    background-position: 3px center !important;
  }
  .ep_subjectinput_tree dt:not(.ep_subjectinput_tree) {
    padding: 2px 4px 2px 20px !important;
  }
  .ep_subjectinput_searchbar,
  .ep_subjectinput_selections {
    padding: 5px 6px !important;
    font-size: 0.74rem !important;
  }
}

/* ========================================================
   13. PUBLIC ITEM SUMMARY PAGE (PC & MOBILE/HP)
   ======================================================== */
.ep_summary_content,
.ep_summary_content_main {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Top Citation Line ("Mubayin, Anas (2023) ...") - Secondary Info, Compact */
.ep-summary-citation-para,
.ep_summary_content_main > p:first-of-type:not(.ep_field_para) {
  font-size: 0.8rem !important;
  line-height: 1.45 !important;
  color: #475569 !important;
  margin: 0 0 0.6rem 0 !important;
  padding: 0.45rem 0.65rem !important;
  background: #f8fafc !important;
  border: 1px solid #eef2f6 !important;
  border-radius: 6px !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

/* Document Download Box */
table.ep-summary-doc-table,
.ep_summary_content_main > table:first-of-type:not(.ep-summary-meta-table):not(.ep_summary_page_actions) {
  display: table !important;
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 0.45rem 0.65rem !important;
  margin: 0 0 0.7rem 0 !important;
  box-sizing: border-box !important;
}
table.ep-summary-doc-table td:first-child {
  width: 52px !important;
  padding: 2px 0.65rem 2px 2px !important;
  text-align: center !important;
  vertical-align: middle !important;
}
table.ep-summary-doc-table .ep_doc_icon {
  max-width: 44px !important;
  height: auto !important;
  border-radius: 4px !important;
  border: 1px solid #cbd5e1 !important;
  padding: 1px !important;
  background: #ffffff !important;
}
table.ep-summary-doc-table td:last-child {
  vertical-align: middle !important;
  font-size: 0.8rem !important;
  line-height: 1.4 !important;
  color: #1e293b !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  padding: 2px 0 !important;
}
table.ep-summary-doc-table .document_format {
  font-weight: 700 !important;
  font-size: 0.72rem !important;
  color: #065f46 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
}
table.ep-summary-doc-table .document_filename {
  font-size: 0.78rem !important;
  color: #334155 !important;
}
table.ep-summary-doc-table a.ep_document_link,
table.ep-summary-doc-table td:last-child a {
  font-weight: 600 !important;
  font-size: 0.78rem !important;
  color: #047857 !important;
  text-decoration: none !important;
}
table.ep-summary-doc-table a.ep_document_link:hover,
table.ep-summary-doc-table td:last-child a:hover {
  text-decoration: underline !important;
  color: #065f46 !important;
}

/* Abstract Section: Full Width on Desktop & Compact Toggle */
.ep_summary_content_main h2,
h2.ep-summary-abstract-heading {
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  text-align: left !important;
  margin: 0.65rem 0 0.35rem 0 !important;
  padding: 0 0 0.25rem 0 !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
  line-height: 1.3 !important;
}
.ep-summary-abstract-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 0.7rem 0 !important;
  box-sizing: border-box !important;
}
.ep-summary-abstract-content {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
}
.ep-summary-abstract-content.is-collapsed {
  max-height: 6.4em !important;
  overflow: hidden !important;
}
.ep-summary-abstract-content.is-collapsed::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 2.2em !important;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.96)) !important;
  pointer-events: none !important;
}
.ep_summary_content_main p.ep_field_para,
.ep-summary-abstract-content p.ep_field_para {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  font-size: 0.86rem !important;
  line-height: 1.62 !important;
  color: #1e293b !important;
  text-align: justify !important;
  word-break: break-word !important;
}
.ep-summary-abstract-toggle-wrap {
  margin-top: 0.35rem !important;
  display: flex !important;
  justify-content: flex-start !important;
}

/* Metadata Table (Item Type, Supervisor, Subjects, Divisions, Depositing User, Date, URI) */
table.ep-summary-meta-table {
  display: table !important;
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
  margin: 0.6rem 0 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
table.ep-summary-meta-table tr:nth-child(odd) {
  background-color: #f8fafc !important;
}
table.ep-summary-meta-table tr:nth-child(even) {
  background-color: #ffffff !important;
}
table.ep-summary-meta-table th {
  width: 155px !important;
  text-align: left !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  color: #475569 !important;
  padding: 5px 10px !important;
  vertical-align: top !important;
  border-bottom: 1px solid #eef2f6 !important;
  border-right: 1px solid #eef2f6 !important;
  line-height: 1.35 !important;
  word-break: break-word !important;
}
table.ep-summary-meta-table td {
  font-size: 0.78rem !important;
  line-height: 1.4 !important;
  color: #1e293b !important;
  padding: 5px 10px !important;
  vertical-align: top !important;
  border-bottom: 1px solid #eef2f6 !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}
table.ep-summary-meta-table td a {
  color: #047857 !important;
  text-decoration: none !important;
}
table.ep-summary-meta-table td a:hover {
  text-decoration: underline !important;
}

/* Actions (login required) - Compact & Unobtrusive */
h2#actions,
.ep_summary_content_main h2#actions,
h2.ep-summary-actions-heading {
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  color: #64748b !important;
  text-align: left !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  margin: 0.55rem 0 0.2rem 0 !important;
  padding: 0 !important;
  border: none !important;
}
table.ep_summary_page_actions {
  display: inline-table !important;
  width: auto !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  margin: 0 !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
}
table.ep_summary_page_actions td {
  padding: 3px 6px !important;
  font-size: 0.72rem !important;
  line-height: 1.2 !important;
  color: #475569 !important;
  vertical-align: middle !important;
}
table.ep_summary_page_actions td:first-child {
  padding-right: 2px !important;
}
table.ep_summary_page_actions img.ep_form_action_icon {
  width: 15px !important;
  height: 15px !important;
  vertical-align: middle !important;
  display: block !important;
}
table.ep_summary_page_actions a.ep-summary-action-link {
  color: #475569 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
table.ep_summary_page_actions a.ep-summary-action-link:hover {
  color: #047857 !important;
  text-decoration: underline !important;
}

/* Mobile / HP Adjustments for Public Item Summary Page */
@media (max-width: 768px) {
  .ep-summary-citation-para,
  .ep_summary_content_main > p:first-of-type:not(.ep_field_para) {
    font-size: 0.64rem !important;
    line-height: 1.32 !important;
    color: #475569 !important;
    padding: 0.3rem 0.45rem !important;
    margin: 0 0 0.4rem 0 !important;
    border-radius: 5px !important;
  }

  table.ep-summary-doc-table,
  .ep_summary_content_main > table:first-of-type:not(.ep-summary-meta-table):not(.ep_summary_page_actions) {
    padding: 0.32rem 0.45rem !important;
    margin: 0 0 0.45rem 0 !important;
    border-radius: 6px !important;
  }
  table.ep-summary-doc-table td:first-child {
    width: 34px !important;
    padding: 1px 0.4rem 1px 1px !important;
  }
  table.ep-summary-doc-table .ep_doc_icon {
    max-width: 30px !important;
  }
  table.ep-summary-doc-table td:last-child,
  table.ep-summary-doc-table .document_filename,
  table.ep-summary-doc-table a.ep_document_link,
  table.ep-summary-doc-table td:last-child a {
    font-size: 0.65rem !important;
    line-height: 1.3 !important;
  }
  table.ep-summary-doc-table .document_format {
    font-size: 0.6rem !important;
  }

  .ep_summary_content_main h2,
  h2.ep-summary-abstract-heading {
    font-size: 0.74rem !important;
    margin: 0.4rem 0 0.22rem 0 !important;
    padding-bottom: 0.15rem !important;
  }
  .ep-summary-abstract-wrapper {
    margin: 0 0 0.45rem 0 !important;
  }
  .ep_summary_content_main p.ep_field_para,
  .ep-summary-abstract-content p.ep_field_para {
    font-size: 0.68rem !important;
    line-height: 1.44 !important;
    text-align: left !important;
  }
  .ep-summary-abstract-content.is-collapsed {
    max-height: 5.75em !important;
  }
  .ep-summary-abstract-toggle-wrap .ep-abstract-toggle-btn {
    font-size: 0.63rem !important;
    padding: 2px 7px !important;
  }

  table.ep-summary-meta-table {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    margin: 0.35rem 0 !important;
  }
  table.ep-summary-meta-table th {
    width: 31% !important;
    max-width: 86px !important;
    font-size: 0.63rem !important;
    line-height: 1.25 !important;
    padding: 3px 5px !important;
    text-align: left !important;
    word-break: break-word !important;
  }
  table.ep-summary-meta-table td {
    width: 69% !important;
    font-size: 0.63rem !important;
    line-height: 1.28 !important;
    padding: 3px 5px !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }

  h2#actions,
  .ep_summary_content_main h2#actions,
  h2.ep-summary-actions-heading {
    font-size: 0.6rem !important;
    margin: 0.35rem 0 0.12rem 0 !important;
  }
  table.ep_summary_page_actions td {
    padding: 2px 4px !important;
    font-size: 0.62rem !important;
  }
  table.ep_summary_page_actions img.ep_form_action_icon {
    width: 12px !important;
    height: 12px !important;
  }
}

/* ========================================================
   DETAILS TAB: "Edit item" button aligned in Column 2
   (Sejajar vertikal lurus pada kolom ke-2 / kolom nilai)
   ======================================================== */
th.ep_title_row {
  vertical-align: middle !important;
  border-left: none !important;
  border-right: none !important;
}
th.ep_title_row_title {
  text-align: left !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  color: #1e293b !important;
  padding: 0.35rem 0.5rem !important;
}
th.ep_title_row_action {
  text-align: left !important;
  padding: 0.35rem 0.25em !important;
}
th.ep_title_row_action form,
th.ep_title_row_action div {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
}
th.ep_title_row_action .ep_form_action_button {
  margin: 0 !important;
  padding: 4px 12px !important;
  font-size: 0.82rem !important;
  line-height: 1.3 !important;
}

/* Fallback for legacy markup if cached */
th.ep_title_row .ep_title_row_inner {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
}
th.ep_title_row .ep_title_row_inner > div {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
}
th.ep_title_row .ep_title_row_inner > div > div:first-child {
  width: 20% !important;
  min-width: 90px !important;
  text-align: left !important;
  font-weight: 700 !important;
}
th.ep_title_row .ep_title_row_inner > div > div:last-child {
  text-align: left !important;
  display: inline-flex !important;
}
th.ep_title_row .ep_title_row_inner > div > div:last-child form {
  display: inline-flex !important;
  margin: 0 !important;
}

/* --- Latest Additions / Homepage Styling on Mobile & Desktop --- */
.latest-items-container {
  text-align: left !important;
}
.latest-title {
  font-size: clamp(1.1rem, 3.5vw, 1.4rem) !important;
}
.latest-subtitle {
  font-size: clamp(0.78rem, 2vw, 0.88rem) !important;
}
.btn-latest-all {
  background-color: #064e3b !important;
  color: #ffffff !important;
  border: 1px solid #047857 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  transition: background-color 0.2s, transform 0.2s;
}
.btn-latest-all:hover,
.btn-latest-all:focus {
  background-color: #047857 !important;
  color: #ffffff !important;
}
.btn-latest-all span,
.btn-latest-all i {
  color: #ffffff !important;
}

/* Desktop Table view for Latest Tool */
.ep_latest_tool_list {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 10px !important;
}
.ep_latest_tool_list tr.ep_search_result td {
  vertical-align: top !important;
  font-size: 0.95rem;
  line-height: 1.55;
  text-align: left !important;
}
.ep_latest_tool_list tr.ep_search_result td:first-child {
  width: 28px !important;
  font-weight: 700 !important;
  color: #047857 !important;
}
.ep_latest_tool_list tr.ep_search_result td a {
  color: #0f172a;
  font-weight: 600;
  text-decoration: none;
}
.ep_latest_tool_list tr.ep_search_result td a:hover {
  color: #047857;
  text-decoration: underline;
}

/* Mobile Screen Optimizations (< 768px) */
@media (max-width: 767.98px) {
  .header-latest-text {
    width: 100% !important;
  }
  .header-latest-btn {
    width: 100% !important;
    display: flex !important;
    justify-content: flex-start !important;
    margin-top: 6px !important;
  }
  .header-latest-btn .btn-latest-all {
    padding: 4px 14px !important;
    font-size: 0.8rem !important;
  }

  .ep_latest_tool_list,
  .ep_latest_tool_list tbody,
  .ep_latest_tool_list tr.ep_search_result {
    display: block !important;
    width: 100% !important;
  }

  .ep_latest_tool_list tr.ep_search_result {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-left: 4px solid #047857 !important;
    border-radius: 10px !important;
    padding: 10px 12px !important;
    margin-bottom: 12px !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03) !important;
  }

  .ep_latest_tool_list tr.ep_search_result td {
    display: block !important;
    padding: 0 !important;
    text-align: left !important;
    width: 100% !important;
  }

  /* Nomor urut badge */
  .ep_latest_tool_list tr.ep_search_result td:first-child {
    display: inline-block !important;
    background: #e6f4ea !important;
    color: #047857 !important;
    font-weight: 700 !important;
    font-size: 0.72rem !important;
    padding: 1px 7px !important;
    border-radius: 12px !important;
    margin-bottom: 4px !important;
    width: auto !important;
  }

  /* Konten naskah */
  .ep_latest_tool_list tr.ep_search_result td:nth-child(2) {
    font-size: 0.82rem !important;
    line-height: 1.42 !important;
    color: #475569 !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    text-align: left !important;
  }

  .ep_latest_tool_list tr.ep_search_result td:nth-child(2) .person_name {
    display: inline;
    font-weight: 700 !important;
    color: #1e293b !important;
    font-size: 0.84rem !important;
  }

  .ep_latest_tool_list tr.ep_search_result td:nth-child(2) a {
    display: inline !important;
    font-size: 0.82rem !important;
    color: #0284c7 !important;
    font-weight: 600 !important;
    line-height: 1.38 !important;
  }

  .ep_latest_tool_list tr.ep_search_result td:nth-child(2) em {
    font-style: normal !important;
  }

  /* Baris Dokumen Icon di bagian bawah */
  .ep_latest_tool_list tr.ep_search_result td:last-child {
    border-top: 1px dashed #e2e8f0 !important;
    margin-top: 6px !important;
    padding-top: 6px !important;
    text-align: left !important;
  }

  .ep_latest_tool_list tr.ep_search_result td:last-child div {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }

  .ep_latest_tool_list tr.ep_search_result td:last-child img.ep_doc_icon {
    height: 24px !important;
    width: auto !important;
  }
}

/* Disable and suppress popup hover previews on mobile and touch devices */
@media (max-width: 991.98px) {
  .ep_preview,
  div.ep_preview,
  [id^="doc_preview_"] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    max-width: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    left: -9999px !important;
    top: -9999px !important;
  }
}
