/* Base layout */
.midlt-wrap{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,"Noto Sans";line-height:1.35}
.midlt-toolbar{display:flex;gap:12px;margin:12px 0 18px;  flex-direction: row; background-color: #60C5BF; padding: 10px; border-radius: 10px;}
.midlt-input,.midlt-select{padding:8px 10px;border:1px solid #d1d5db;border-radius:10px;min-width:220px}
.midlt-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;position:relative}
.midlt-table{width:100%;border-collapse:collapse}
.midlt-th,.midlt-td{padding:10px 12px;border-bottom:1px solid #e5e7eb;vertical-align:top;word-break:break-word}
.midlt-th{position:sticky;top:0;background:#f9fafb;cursor:pointer;text-align:left;z-index:1}
.midlt-tr:hover .midlt-td{background:#fbfdff}
.midlt-note{font-size:12px;color:#ffffff}
.midlt-empty{margin:12px 0;color:#6b7280}

/* Desktop image column (thumbnail) */
.midlt-img-cell{width:170px}
.midlt-img{
  display:block;
  width:160px;
  height:110px;
  object-fit:cover;
  border-radius:8px;
  border:1px solid #e5e7eb;
}

/* Lightbox */
.midlt-lightbox{
  position:fixed; inset:0;
  display:none; align-items:center; justify-content:center;
  z-index:9999; color:#fff;
}
.midlt-lightbox.is-open{display:flex}
.midlt-lightbox__backdrop{
  position:absolute; inset:0; background:rgba(0,0,0,.85);
}
.midlt-lightbox__content{
  position:relative; z-index:1; text-align:center; padding:12px 16px;
}
.midlt-lightbox__img{
  max-width:90vw; max-height:80vh; border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.4);
}
.midlt-lightbox__caption{margin-top:10px; font-size:14px; color:#e5e7eb}
.midlt-lightbox__close{
  position:absolute; top:-8px; right:-8px;
  width:36px; height:36px; border-radius:999px; border:none;
  background:#111827; color:#fff; font-size:22px; cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.35);
}

/* Hide the mobile card image row by default (desktop/tablet) */
.midlt-card-media{ display:none; }

/* Mobile Card Mode */
@media (max-width: 640px){
  .midlt-table,
  .midlt-table thead,
  .midlt-table tbody,
  .midlt-table tr,
  .midlt-table th,
  .midlt-table td { display:block; width:100%; }

  .midlt-table thead { display:none; }

  .midlt-tr {
    margin:16px 0;
    border:1px solid #dfe6ee; border-radius:12px; overflow:hidden; background:#fff;
    box-shadow:0 1px 0 rgba(16,24,40,.02), 0 8px 24px rgba(16,24,40,.06);
  }
  .midlt-tr::before{
    content:""; display:block; height:4px;
    background:linear-gradient(90deg,#11c5c6,#0fb5b6 50%,#0aa3a5);
  }

  .midlt-card-media{
    display:block; padding:0; border-bottom:1px solid #eef2f7;
  }
  .midlt-card-media img{
    display:block; width:100%; height:auto; max-height:220px; object-fit:cover;
  }

  .midlt-td {
    display:flex; gap:16px; align-items:flex-start;
    padding:10px 12px; border-bottom:1px solid #f0f4f8; color:#0f172a; line-height:1.5;
  }
  .midlt-td:last-child{ border-bottom:none; }

  .midlt-td::before{
    content:attr(data-label);
    flex:0 0 40%;
    min-width:110px;
    font-weight:700; color:#64748b;
    text-transform:uppercase; letter-spacing:.04em; font-size:.74rem;
    padding-right:10px; border-right:1px solid #eef2f7;
  }

  /* Make the first field (Lure Type) a mini title row */
  .midlt-tr .midlt-td:first-child{
    background:#f4f7ff; font-weight:800; font-size:1.05rem;
  }
  .midlt-tr .midlt-td:first-child::before{
    color:#475569; border-right-color:#e6ecf3;
  }

  /* Hide desktop image column in mobile (we show full-width card image already) */
  .midlt-th[data-col="Image"],
  .midlt-td[data-col="Image"] { display:none !important; }
}

/* Small-screen toolbar tweaks */
@media (max-width: 640px){
  .midlt-input,.midlt-select{min-width:unset;flex:1}
  .midlt-toolbar{gap:8px;flex-direction:column}
  .midlt-th,.midlt-td{padding:8px 10px}
}