/* Wide Layout Override for Dashboard - Maximum Screen Utilization */

/* Remove container max-width restrictions for full-width layout */
.container {
    max-width: none !important;
    width: 100% !important;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Enhanced responsive padding for better screen utilization */
@media (min-width: 640px) {
    .container {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

@media (min-width: 1024px) {
    .container {
        padding-left: 2rem;
        padding-right: 2rem;
    }
}

@media (min-width: 1280px) {
    .container {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }
}

@media (min-width: 1536px) {
    .container {
        padding-left: 3rem;
        padding-right: 3rem;
    }
}

/* Override container-fluid for maximum width utilization */
.container-fluid {
    width: 100% !important;
    max-width: none !important;
    padding-left: 2rem;
    padding-right: 2rem;
}

/* Ensure main content areas use full width */
.app-container,
.main-content,
.page-container,
.content-area {
    width: 100% !important;
    max-width: none !important;
}

/* Enhanced responsive padding for content areas */
.responsive-padding {
    padding: 1.5rem;
}

@media (min-width: 640px) {
    .responsive-padding {
        padding: 2rem;
    }
}

@media (min-width: 1024px) {
    .responsive-padding {
        padding: 2.5rem;
    }
}

@media (min-width: 1280px) {
    .responsive-padding {
        padding: 3rem;
    }
}

@media (min-width: 1536px) {
    .responsive-padding {
        padding: 3.5rem;
    }
}

/* Dashboard specific wide layout styles */
.dashboard-wide {
    width: 100% !important;
    max-width: none !important;
}

/* Grid layouts should utilize full width */
.grid {
    width: 100% !important;
}

/* Cards and components should expand properly */
.card {
    width: 100%;
}

/* Form grids should be more expansive */
.form-grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
}

@media (min-width: 1280px) {
    .form-grid {
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: 2.5rem;
    }
}

@media (min-width: 1536px) {
    .form-grid {
        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
        gap: 3rem;
    }
}

/* Enhanced grid layouts for wide screens */
@media (min-width: 1280px) {
    .lg\:grid-cols-3 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    .lg\:grid-cols-5 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

@media (min-width: 1536px) {
    .lg\:grid-cols-3 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    .lg\:grid-cols-5 {
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }
}

/* Utility class for forcing full width */
.w-full-override {
    width: 100% !important;
    max-width: none !important;
}
