/* Images to PDF - Premium Single Responsive Styles */
.img2pdf-container { max-width: 1200px; margin: 2rem auto; padding: 0 1.5rem; }
.img2pdf-wrapper { max-width: 950px; margin: 0 auto; }

.img2pdf-title { font-size: 3rem; font-weight: 800; text-align: center; color: var(--text); }
.img2pdf-heart { font-size: 2.8rem; animation: pulse 2s infinite; }

.upload-area, .img2pdf-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 2rem; box-shadow: var(--shadow); }

.upload-area { border: 3px dashed var(--border); text-align: center; cursor: pointer; }
.upload-area:hover { border-color: var(--primary); }

.images-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1.2rem;
    margin: 2rem 0;
}
.image-item {
    position: relative;
    border: 2px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg);
}
.image-item img {
    width: 100%;
    height: 180px;
    object-fit: cover;
}
.image-controls {
    position: absolute;
    top: 8px; right: 8px;
    display: flex;
    gap: 6px;
    background: rgba(0,0,0,0.6);
    padding: 4px;
    border-radius: 8px;
}
.image-controls button {
    width: 28px; height: 28px;
    background: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
}

.toolbar {
    background: var(--bg);
    padding: 1rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}
.toolbar select, .toolbar input { margin: 0 10px 0 5px; }

.img2pdf-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.generate-btn {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: white;
    border: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 700;
}

/* Download Card - identical to your other tools */
.download-card-container { margin-top: 2.5rem; }
.download-card { /* exact same styles as PDF to Images & BMI */ 
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border-radius: 24px;
    padding: 2rem;
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}
.dark-mode .download-card { background: linear-gradient(135deg, #1e1e2e, #2d2d44); }

/* Mobile */
@media (max-width: 767px) {
    .images-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
    .img2pdf-title { font-size: 2.4rem; }
}