/* UserPanel Responsive Styles - Smaller fonts and sizes for mobile */

/* Reduce heading sizes */
.user-panel-content h1,
.user-panel-content .text-3xl,
.user-panel-content .text-4xl {
    font-size: 1.5rem !important; /* text-2xl */
}

@media (min-width: 640px) {
    .user-panel-content h1,
    .user-panel-content .text-3xl {
        font-size: 1.75rem !important; /* text-2xl sm */
    }
    
    .user-panel-content .text-4xl {
        font-size: 2rem !important; /* text-3xl sm */
    }
}

.user-panel-content h2,
.user-panel-content .text-2xl {
    font-size: 1.25rem !important; /* text-xl */
}

@media (min-width: 640px) {
    .user-panel-content h2,
    .user-panel-content .text-2xl {
        font-size: 1.5rem !important; /* text-2xl sm */
    }
}

.user-panel-content h3,
.user-panel-content .text-xl {
    font-size: 1.125rem !important; /* text-lg */
}

/* Reduce icon sizes */
.user-panel-content .text-6xl {
    font-size: 2.5rem !important; /* text-4xl */
}

.user-panel-content .text-4xl {
    font-size: 1.75rem !important; /* text-2xl */
}

.user-panel-content .text-2xl {
    font-size: 1.25rem !important; /* text-xl */
}

/* Reduce icon container sizes */
.user-panel-content .w-16.h-16,
.user-panel-content .w-16.h-16 {
    width: 3rem !important; /* w-12 */
    height: 3rem !important; /* h-12 */
}

.user-panel-content .w-14.h-14 {
    width: 2.5rem !important; /* w-10 */
    height: 2.5rem !important; /* h-10 */
}

.user-panel-content .w-24.h-24 {
    width: 4rem !important; /* w-16 */
    height: 4rem !important; /* h-16 */
}

/* Reduce padding in cards and containers */
.user-panel-content .p-8 {
    padding: 1rem !important; /* p-4 */
}

@media (min-width: 640px) {
    .user-panel-content .p-8 {
        padding: 1.25rem !important; /* p-5 sm */
    }
}

.user-panel-content .p-12 {
    padding: 1.5rem !important; /* p-6 */
}

@media (min-width: 640px) {
    .user-panel-content .p-12 {
        padding: 2rem !important; /* p-8 sm */
    }
}

.user-panel-content .p-6 {
    padding: 0.875rem !important; /* p-3.5 */
}

/* Reduce margins */
.user-panel-content .mb-8 {
    margin-bottom: 1rem !important; /* mb-4 */
}

@media (min-width: 640px) {
    .user-panel-content .mb-8 {
        margin-bottom: 1.5rem !important; /* mb-6 sm */
    }
}

.user-panel-content .mb-6 {
    margin-bottom: 0.75rem !important; /* mb-3 */
}

.user-panel-content .mb-4 {
    margin-bottom: 0.5rem !important; /* mb-2 */
}

/* Reduce gap sizes in grids */
.user-panel-content .gap-6 {
    gap: 0.75rem !important; /* gap-3 */
}

@media (min-width: 640px) {
    .user-panel-content .gap-6 {
        gap: 1rem !important; /* gap-4 sm */
    }
}

/* Reduce rounded sizes */
.user-panel-content .rounded-2xl {
    border-radius: 0.75rem !important; /* rounded-xl */
}

/* Reduce shadow sizes */
.user-panel-content .shadow-2xl {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; /* shadow-lg */
}

/* Reduce text sizes in buttons and links */
.user-panel-content button,
.user-panel-content .btn {
    font-size: 0.875rem !important; /* text-sm */
    padding: 0.5rem 1rem !important; /* py-2 px-4 */
}

/* Reduce breadcrumb sizes */
.user-panel-content .breadcrumb {
    font-size: 0.75rem !important; /* text-xs */
}

/* Reduce card padding */
/*.user-panel-content .card,
.user-panel-content [class*="card"] {*/
    /*padding: 0.875rem !important;*/ /* p-3.5 */
/*}*/

/* Reduce spacing in lists */
.user-panel-content ul li,
.user-panel-content ol li {
    margin-bottom: 0.5rem !important; /* mb-2 */
}

/* Mobile specific adjustments */
@media (max-width: 640px) {
    .user-panel-content {
        font-size: 0.875rem !important; /* text-sm base */
    }
    
    .user-panel-content h1,
    .user-panel-content .text-3xl,
    .user-panel-content .text-4xl {
        font-size: 1.25rem !important; /* text-xl */
    }
    
    .user-panel-content h2,
    .user-panel-content .text-2xl {
        font-size: 1.125rem !important; /* text-lg */
    }
    
    .user-panel-content .w-16.h-16 {
        width: 2.5rem !important; /* w-10 */
        height: 2.5rem !important; /* h-10 */
    }
    
    .user-panel-content .p-6 {
        padding: 0.75rem !important; /* p-3 */
    }
    
    .user-panel-content .mb-8 {
        margin-bottom: 0.75rem !important; /* mb-3 */
    }
}