/* =========================================
   1. ১০ কলাম গ্রিড (এক লাইনে ১০টি)
   ========================================= */
.ecfm-gallery-grid {
    display: grid;
    /* ডেসক্রিপশনে ১০টি কলাম */
    grid-template-columns: repeat(10, 1fr); 
    gap: 6px; /* গ্যাপ খুব কম রাখা হয়েছে */
    margin: 20px 0;
}

/* রেসপন্সিভ (মোবাইল/ট্যাবলেটের জন্য) */
@media (max-width: 1200px) { .ecfm-gallery-grid { grid-template-columns: repeat(8, 1fr); } }
@media (max-width: 900px) { .ecfm-gallery-grid { grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 600px) { .ecfm-gallery-grid { grid-template-columns: repeat(3, 1fr); } }

/* =========================================
   2. কার্ড এবং ফিক্সড ছোট ইমেজ (১" x ০.৭৫")
   ========================================= */
.ecfm-item-card {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 3px;
    overflow: hidden;
    transition: 0.2s;
    font-size: 11px;
}
.ecfm-item-card:hover {
    border-color: #0073aa;
    transform: translateY(-2px);
}

/* ছবির বক্স (ফিক্সড সাইজ) */
.ecfm-img-link {
    display: block;
    width: 100%;
    /* [গুরুত্বপূর্ণ] হাইট ফিক্সড করে দেওয়া হলো (approx 0.75 inch) */
    height: 75px; 
    overflow: hidden;
    background: #f1f1f1;
    border-bottom: 1px solid #eee;
}

/* ছবির আচরণ (কেটে ফিট হবে) */
.ecfm-thumb-img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* ছবি চ্যাপ্টা না হয়ে বক্সে ফিট হবে */
    object-position: center;
}

.ecfm-no-img {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ccc;
    font-size: 9px;
}

/* =========================================
   3. টাইটেল এবং বাটন (Compact Design)
   ========================================= */
.ecfm-card-body {
    padding: 5px; /* প্যাডিং কমানো হয়েছে */
    text-align: center;
}

.ecfm-title-tiny {
    font-size: 11px;
    margin: 0 0 5px;
    line-height: 1.2;
    font-weight: 600;
    /* ১ লাইনের বেশি হলে ডট (...) দেখাবে */
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis;
}
.ecfm-title-tiny a { text-decoration: none; color: #333; }
.ecfm-title-tiny a:hover { color: #0073aa; }

.ecfm-view-btn-tiny {
    display: block;
    background: #0073aa;
    color: #fff;
    padding: 2px 0;
    border-radius: 2px;
    text-decoration: none;
    font-size: 10px;
}
.ecfm-view-btn-tiny:hover { background: #005177; }

/* =========================================
   4. পেজিনেশন (Next/Prev 1 2 3...)
   ========================================= */
.ecfm-pagination {
    margin: 30px 0;
    text-align: center;
    display: flex;
    justify-content: center;
}
.ecfm-pagination ul {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-wrap: wrap; gap: 4px;
}
.ecfm-pagination a, .ecfm-pagination span {
    display: block; padding: 6px 12px;
    background: #fff; border: 1px solid #ccc;
    color: #333; text-decoration: none; border-radius: 3px;
    font-size: 13px; font-weight: bold;
}
.ecfm-pagination span.current, .ecfm-pagination a:hover {
    background: #0073aa; color: #fff; border-color: #0073aa;
}

/* অন্যান্য পেজ */
.ecfm-upload-wrapper, .ecfm-login-container, .ecfm-single-wrapper {
    background: #fff; padding: 20px; border: 1px solid #ddd; max-width: 600px; margin: 20px auto;
}