/* ========================================
   COMPACT UI STYLES - GLOBAL
   Applied to all grids, forms, and controls
   ======================================== */

/* Compact Form Controls */
.form-control,
.form-select,
select.form-control,
input.form-control,
textarea.form-control {
    padding: 0.375rem 0.75rem !important;
    /* Reduced from default Bootstrap */
    font-size: 0.875rem !important;
    /* Slightly smaller text */
    height: calc(1.5em + 0.75rem + 2px) !important;
    /* Compact height */
    line-height: 1.5 !important;
}

/* Compact Labels */
label,
.form-label {
    font-size: 0.875rem !important;
    margin-bottom: 0.25rem !important;
    /* Reduced from 0.5rem */
    font-weight: 500;
}

/* Compact Form Groups */
.form-group {
    margin-bottom: 0.75rem !important;
    /* Reduced from 1rem */
}

/* Compact Buttons */
.btn {
    padding: 0.375rem 0.75rem !important;
    /* Reduced padding */
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
}

.btn-sm {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.8125rem !important;
}

/* Compact Input Groups */
.input-group {
    font-size: 0.875rem !important;
}

.input-group-text {
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
}

/* Compact Filter Sections */
.filter-section,
.filters-container {
    padding: 0.75rem !important;
    /* Reduced from 1rem */
}

.filter-section .row {
    margin-bottom: 0.5rem !important;
    /* Reduced spacing between rows */
}

.filter-section .col-md-3,
.filter-section .col-md-4,
.filter-section .col-md-6 {
    padding: 0 0.5rem !important;
    /* Reduced column padding */
    margin-bottom: 0.5rem !important;
}

/* Compact Cards */
.glass-card,
.card {
    padding: 1rem !important;
    /* Reduced from 1.5rem or 2rem */
}

.card-header {
    padding: 0.75rem 1rem !important;
}

.card-body {
    padding: 1rem !important;
}

/* Compact Modals */
.modal-body {
    padding: 1rem !important;
    /* Reduced from 1.5rem */
}

.modal-header {
    padding: 0.75rem 1rem !important;
}

.modal-footer {
    padding: 0.75rem 1rem !important;
}

/* Compact Badges */
.badge {
    padding: 0.4rem 0.8rem !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
}

/* Compact Pagination */
.pagination {
    margin-bottom: 0.5rem !important;
}

.pagination .page-link {
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
}

/* Compact Dropdowns */
.dropdown-menu {
    font-size: 0.875rem !important;
}

.dropdown-item {
    padding: 0.375rem 1rem !important;
}

/* Compact Alerts */
.alert {
    padding: 0.75rem 1rem !important;
    font-size: 0.875rem !important;
}

/* Compact List Groups */
.list-group-item {
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem !important;
}

/* Compact Nav Tabs */
.nav-tabs .nav-link {
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem !important;
}

/* Compact Breadcrumbs */
.breadcrumb {
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem !important;
}

/* Compact Floating Labels */
.floating-label {
    margin-bottom: 0.75rem !important;
}

.floating-label label {
    font-size: 0.8125rem !important;
}

/* Compact Select2 (if used) */
.select2-container--default .select2-selection--single {
    height: calc(1.5em + 0.75rem + 2px) !important;
    padding: 0.375rem 0.75rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: calc(1.5em + 0.75rem) !important;
    font-size: 0.875rem !important;
}

/* Compact Checkboxes and Radios */
.form-check {
    margin-bottom: 0.5rem !important;
}

.form-check-label {
    font-size: 0.875rem !important;
}

/* Compact File Inputs */
.form-control-file {
    font-size: 0.875rem !important;
}

/* Compact Progress Bars */
.progress {
    height: 1rem !important;
    /* Reduced from 1.25rem */
    font-size: 0.75rem !important;
}

/* Compact Tooltips */
.tooltip {
    font-size: 0.8125rem !important;
}

/* Compact Popovers */
.popover {
    font-size: 0.875rem !important;
}

/* Compact Spinners */
.spinner-border-sm {
    width: 1rem !important;
    height: 1rem !important;
}

/* Compact Headers in Cards */
.glass-card h3,
.card h3 {
    font-size: 1.25rem !important;
    /* Reduced from 1.5rem */
    margin-bottom: 0.75rem !important;
}

.glass-card h4,
.card h4 {
    font-size: 1.1rem !important;
    margin-bottom: 0.5rem !important;
}

/* Compact Dashboard Stats */
.stat-card {
    padding: 0.75rem 1rem !important;
}

.stat-card h3 {
    font-size: 1.5rem !important;
    margin-bottom: 0.25rem !important;
}

.stat-card p {
    font-size: 0.8125rem !important;
    margin-bottom: 0 !important;
}

/* Compact Empty States */
.empty-state {
    padding: 1.5rem !important;
    /* Reduced from 2rem */
    font-size: 0.875rem !important;
}

.empty-state i {
    font-size: 2rem !important;
    /* Reduced from 3rem */
    margin-bottom: 0.5rem !important;
}

/* Compact Spacing Utilities Override */
.mb-4 {
    margin-bottom: 1rem !important;
    /* Reduced from 1.5rem */
}

.mb-3 {
    margin-bottom: 0.75rem !important;
    /* Reduced from 1rem */
}

.mb-2 {
    margin-bottom: 0.5rem !important;
}

.p-4 {
    padding: 1rem !important;
    /* Reduced from 1.5rem */
}

.p-3 {
    padding: 0.75rem !important;
    /* Reduced from 1rem */
}

/* Compact Row Spacing */
.row {
    margin-left: -0.5rem !important;
    margin-right: -0.5rem !important;
}

.row>* {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
}

/* Responsive: Even more compact on mobile */
@media (max-width: 768px) {

    .form-control,
    .btn {
        font-size: 0.8125rem !important;
    }

    .glass-card,
    .card {
        padding: 0.75rem !important;
    }

    .modal-body {
        padding: 0.75rem !important;
    }
}

/* Ensure compact styles don't break specific components */
.btn-icon-sm {
    padding: 0.5rem !important;
    /* Keep icon buttons as is */
}

.avatar-circle {
    /* Keep avatar sizes as is */
    width: 40px !important;
    height: 40px !important;
}

/* ========================================
   EXTRA COMPACT TABLE ROWS
   ======================================== */

/* Make table rows even more compact */
.modern-table tbody td {
    padding: 0.375rem 0.75rem !important;
    /* Reduced from 0.5rem 1rem */
    font-size: 0.875rem !important;
    line-height: 1.4 !important;
}

.modern-table thead th {
    padding: 0.5rem 0.75rem !important;
    /* Reduced from 0.75rem 1rem */
    font-size: 0.8125rem !important;
}

/* Compact avatar in tables */
.modern-table .avatar-circle {
    width: 32px !important;
    /* Reduced from 40px */
    height: 32px !important;
    font-size: 0.875rem !important;
    margin-right: 0.5rem !important;
}

/* Compact action buttons */
.modern-table .btn-icon-sm {
    padding: 0.375rem !important;
    /* Reduced from 0.5rem */
    font-size: 0.875rem !important;
}

/* Compact badges in tables */
.modern-table .badge {
    padding: 0.4rem 0.8rem !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
}

/* Deleted Row Styling */
.row-deleted {
    background-color: #fff5f5 !important;
}

.row-deleted td {
    color: #a0aec0 !important;
}

.row-deleted .avatar-circle {
    background: #e2e8f0 !important;
    color: #718096 !important;
}

.badge-deleted {
    background: #feb2b2 !important;
    color: #9b2c2c !important;
}

/* Completed Row Styling */
.row-completed {
    background-color: #f0fff4 !important;
}

.row-completed td {
    color: #2f855a !important;
}

.row-completed .avatar-circle {
    background: #c6f6d5 !important;
    color: #22543d !important;
}

.badge-completed {
    background: #9ae6b4 !important;
    color: #1c4532 !important;
}

/* Completion Button Styles */
.completion-btn.incomplete {
    color: #cbd5e0 !important;
}

.completion-btn.completed {
    color: #38a169 !important;
}

.completion-btn:hover {
    background-color: rgba(56, 161, 105, 0.1) !important;
    color: #2f855a !important;
}