/* JX Uploader Final styles */
.jxf-panel{background:#fff;border:1px solid #e6eef8;padding:16px;border-radius:10px;max-width:1200px;margin:0 auto;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
.jxf-toolbar{display:flex;gap:8px;align-items:center;position:relative;margin-bottom:10px}
.jxf-btn{background:#2563eb;color:#fff;border:0;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:600;box-shadow:0 6px 18px rgba(37,99,235,0.12)}
.jxf-primary{background:#111827}
.jxf-drop{border:2px dashed #cbd5e1;border-radius:10px;padding:18px;text-align:center;color:#334155;margin-bottom:12px}
.jxf-drop.jxf-dragover{background:#eef6ff;border-color:#93c5fd}
.jxf-msg{margin-top:8px;color:#374151;min-height:20px}
.jxf-h{margin:18px 0 8px;font-size:18px}
.jxf-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.jxf-thumb{background:#fff;border-radius:10px;overflow:hidden;border:1px solid #e6eef8;display:flex;flex-direction:column}
.jxf-thumb img{display:block;width:100%;object-fit:coverdisplay:block;width:100%;height:160px;object-fit:coverheight:160px;object-fit:contain;}
.jxf-thumb figcaption{display:flex;justify-content:space-between;align-items:center;padding:8px;font-size:13px;color:#334155}
.jxf-caption-left{display:flex;align-items:center;gap:8px}
.jxf-caption-right{display:flex;align-items:center;gap:8px}
.jxf-badge{background:#10b981;color:#fff;padding:4px 8px;border-radius:999px;font-size:12px}
.small{padding:6px 8px;border-radius:8px;font-weight:600;cursor:pointer}
.jxf-del{background:#fee2e2;color:#b91c1c;border:0}
.jxf-unmark{background:#fde68a;color:#92400e;border:0}
.jxf-empty{color:#6b7280;padding:12px} 
.jxf-public-gallery{margin-top:12px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.jxf-thumb.selected{outline: 4px solid rgba(36,97,204,0.18);box-shadow:0 6px 18px rgba(37,99,235,0.08);transform:translateY(-3px);transition:transform .12s ease,box-shadow .12s ease}
@media (max-width:900px){ .jxf-public-gallery{grid-template-columns:repeat(2,1fr)!important} }
@media (max-width:480px){ .jxf-public-gallery{grid-template-columns:repeat(1,1fr)!important} }


/* Category headings in the public gallery */
.jxf-cat-title{
  font-size:18px;
  font-weight:700;
  margin:18px 0 8px 0;
  color:#111827;
}

/* Gallery tabs styling */
.jxf-gallery-tabs a.jxf-tab{
  padding:8px 12px;
  background:transparent;
  border-radius:8px;
  text-decoration:none;
  color:#374151;
  border:1px solid transparent;
}
.jxf-gallery-tabs a.jxf-tab.active{
  background: #2461CC;
  color:#ffffff;
  border-color:rgba(36,97,204,0.12);
  box-shadow:0 4px 14px rgba(2,6,23,0.08);
}



/* Fancy category picker for uploader */
.jxf-cat-picker{ display:inline-block; position:relative; margin-right:12px; vertical-align:middle; }
.jxf-cat-btn{ background:linear-gradient(180deg,#ffffff,#f8fafc); border:1px solid #e6eef0; padding:8px 12px; border-radius:999px; cursor:pointer; display:flex; align-items:center; gap:8px; box-shadow:0 4px 10px rgba(2,6,23,0.06); font-weight:600; color:#0f172a; }
.jxf-cat-btn .jxf-cat-selected{ margin-left:6px; font-weight:800; color:#064e3b; }
.jxf-cat-arrow{ opacity:0.7; font-size:12px; margin-left:6px; }
.jxf-cat-list{ position:absolute; left:0; top:calc(100% + 8px); background:#fff; border:1px solid #e6eef0; box-shadow:0 10px 30px rgba(2,6,23,0.08); padding:6px; border-radius:10px; list-style:none; min-width:180px; display:none; z-index:2000; }
.jxf-cat-item{ padding:8px 10px; border-radius:8px; cursor:pointer; margin:4px; transition:background .12s; }
.jxf-cat-item:hover{ background:#ecfeff; }
.jxf-cat-item.active{ background: #2461CC; color:#fff; }
.jxf-cat-picker.open .jxf-cat-list{ display:block; }
.jxf-cat-picker .jxf-cat-btn:focus{ outline:2px solid rgba(6,182,212,0.18); }



/* Prevent images from being upscaled and ensure responsive behavior */
.jxf-public-gallery img,
.jxf-public-item img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
}

/* Ensure thumbnails don't overflow their grid cells */
.jxf-public-item { overflow: hidden; }

/* Avoid extremely tall automatic stretching */
.jxf-public-gallery img[height="0"],
.jxf-public-gallery img[height=""] {
  height: auto;
}