/* Nabil List Tile - Main Styles */

/* Card Container */
.nabil-list-tile-card {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    line-height: 1.5;
    box-sizing: border-box;
}

.nabil-list-tile-card *,
.nabil-list-tile-card *::before,
.nabil-list-tile-card *::after {
    box-sizing: inherit;
}

/* Card Header */
.nlt-card-header h3 {
    line-height: 1.3;
}

.nlt-card-header p {
    line-height: 1.5;
}

/* Expandable Card */
.nlt-expandable .nlt-card-header {
    user-select: none;
}

.nlt-expandable .nlt-card-header:hover {
    opacity: 0.85;
}

.nlt-expand-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Tiles Container */
.nlt-tiles-container {
    transition: all 0.3s ease;
}

/* Tile Link */
.nlt-tile-link {
    text-decoration: none !important;
    color: inherit !important;
    display: block;
}

.nlt-tile-link:hover,
.nlt-tile-link:focus {
    text-decoration: none !important;
    color: inherit !important;
}

/* Tile Item */
.nlt-tile-item {
    position: relative;
    overflow: hidden;
}

/* Hover Effects */
.nlt-hover-enabled .nlt-tile-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px -5px rgba(0, 0, 0, 0.1), 0 4px 10px -5px rgba(0, 0, 0, 0.04) !important;
}

.nlt-hover-enabled .nlt-tile-link:hover .nlt-tile-item {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px -5px rgba(0, 0, 0, 0.1), 0 4px 10px -5px rgba(0, 0, 0, 0.04) !important;
}

/* Leading Image */
.nlt-tile-item img {
    display: block;
    max-width: 100%;
}

/* Dashicons in Trailing */
.nlt-tile-item .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Responsive Grid - Auto Mode */
@media (max-width: 991.98px) {
    .nlt-tiles-container[data-columns="4"],
    .nlt-tiles-container[data-columns="5"],
    .nlt-tiles-container[data-columns="6"] {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 767.98px) {
    .nlt-tiles-container[data-columns="3"],
    .nlt-tiles-container[data-columns="4"],
    .nlt-tiles-container[data-columns="5"],
    .nlt-tiles-container[data-columns="6"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 575.98px) {
    .nlt-tiles-container[data-columns] {
        grid-template-columns: repeat(1, 1fr) !important;
    }
}

/* Animation */
@keyframes nlt-fade-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.nlt-tile-item {
    animation: nlt-fade-in 0.3s ease forwards;
}

.nlt-tile-item:nth-child(1) { animation-delay: 0.05s; }
.nlt-tile-item:nth-child(2) { animation-delay: 0.1s; }
.nlt-tile-item:nth-child(3) { animation-delay: 0.15s; }
.nlt-tile-item:nth-child(4) { animation-delay: 0.2s; }
.nlt-tile-item:nth-child(5) { animation-delay: 0.25s; }
.nlt-tile-item:nth-child(6) { animation-delay: 0.3s; }

/* Print Styles */
@media print {
    .nabil-list-tile-card {
        box-shadow: none !important;
        border: 1px solid #ddd !important;
    }
    
    .nlt-tile-item {
        box-shadow: none !important;
        border: 1px solid #ddd !important;
        break-inside: avoid;
    }
    
    .nlt-expand-icon {
        display: none !important;
    }
}

/* Accessibility */
.nlt-tile-link:focus .nlt-tile-item,
.nlt-tile-item:focus {
    outline: 2px solid #0073aa;
    outline-offset: 2px;
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    .nabil-list-tile-card.nlt-auto-dark {
        background-color: #1e1e1e;
        color: #e0e0e0;
        border-color: #333;
    }
    
    .nlt-auto-dark .nlt-tile-item {
        background-color: #2d2d2d;
        border-color: #404040;
    }
}
