/**
 * MAIN MODULAR CSS
 * 
 * This file imports only the CSS modules needed for the application.
 * Replace the import of style.bundle.css with this file for a leaner bundle.
 * 
 * Original bundle size: 1.1 MB (40,050 lines)
 * Modular approach: ~50KB (estimated, unminified)
 * Reduction: ~95%
 */

/* External Dependencies (from npm packages - keep as-is) */
/* These are loaded in index.jsx:
 * - bootstrap/dist/css/bootstrap.min.css
 * - datatables.net-bs5/css/dataTables.bootstrap5.min.css
 * - datatables.net-buttons-bs5/css/buttons.bootstrap5.min.css
 * - datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css
 * - @fortawesome/fontawesome-free/css/all.min.css
 * - @formio/js/dist/formio.full.css
 */

/* Modular Application Styles */
@import url('./modular/buttons.css');
@import url('./modular/forms.css');
@import url('./modular/tables.css');
@import url('./modular/sidebar.css');
@import url('./modular/layout.css');
@import url('./modular/header.css');
@import url('./modular/auth.css');
@import url('./modular/dashboard.css');
@import url('./modular/utilities.css');



/* Base Styles - Essential only */
body, html {
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 13px !important;
    font-weight: 400 !important;
    font-family: Poppins, Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@media (max-width: 991.98px) {
    body, html {
        font-size: 13px !important;
    }
}

@media (max-width: 767.98px) {
    body, html {
        font-size: 12px !important;
    }
}

body {
    display: flex;
    flex-direction: column;
    color: #181c32;
    background-color: #c1c7cb;
}

/* Container */
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x, 1.5rem);
    padding-left: var(--bs-gutter-x, 1.5rem);
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1320px !important;
    }
}

/* Wrapper */
.wrapper {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
}

@media (min-width: 992px) {
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        padding: 0 30px;
    }

    .wrapper {
        transition: padding-left 0.3s ease, margin-right 0.3s ease;
    }

    .header-fixed .wrapper {
        padding-top: 65px;
    }
}

@media (max-width: 991.98px) {
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: none;
        padding: 0 15px;
    }

    .header-tablet-and-mobile-fixed .wrapper {
        padding-top: 75px;
    }
}

/* Header */
/* Moved to modular/layout.css */

/* Modal */
.modal-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: 1.75rem 1.75rem;
    border-bottom: 1px solid #eff2f5;
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 1.75rem;
}

.modal-footer {
    display: flex;
    flex-wrap: wrap;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    padding: 1.5rem;
    border-top: 1px solid #eff2f5;
}

/* Card */
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #eff2f5;
}

.card-body {
    flex: 1 1 auto;
    padding: 1.5rem 1.5rem;
}

.card-header {
    padding: 1.5rem 1.5rem;
    margin-bottom: 0;
    background-color: transparent;
    border-bottom: 1px solid #eff2f5;
}

/* Utilities */
.text-muted {
    color: #a1a5b7 !important;
}

.text-primary {
    color: #009ef7 !important;
}

.text-success {
    color: #50cd89 !important;
}

.text-danger {
    color: #f1416c !important;
}

.text-warning {
    color: #ffc700 !important;
}

.text-info {
    color: #7239ea !important;
}

.d-flex {
    display: flex !important;
}

.justify-content-between {
    justify-content: space-between !important;
}

.align-items-center {
    align-items: center !important;
}

.me-3 {
    margin-right: 0.75rem !important;
}

.ms-1 {
    margin-left: 0.25rem !important;
}

.mt-3 {
    margin-top: 0.75rem !important;
}

.mb-3 {
    margin-bottom: 0.75rem !important;
}

.p-3 {
    padding: 0.75rem !important;
}

/* Row/Col Grid */
.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(var(--bs-gutter-y) * -1);
    margin-right: calc(var(--bs-gutter-x) / -2);
    margin-left: calc(var(--bs-gutter-x) / -2);
}

.row > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) / 2);
    padding-left: calc(var(--bs-gutter-x) / 2);
    margin-top: var(--bs-gutter-y);
}

.col-md-6 {
    flex: 0 0 auto;
    width: 50%;
}

@media (min-width: 768px) {
    .col-md-3 {
        flex: 0 0 auto;
        width: 25%;
    }
    .col-md-6 {
        flex: 0 0 auto;
        width: 50%;
    }
    .col-md-9 {
        flex: 0 0 auto;
        width: 75%;
    }
}