/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1169px) {
    /* Header Css */
    .admin-logo {
        text-align: center;
    }
    .buy-button {
        text-align: center;
        margin-bottom: 20px;
    }
    .header-top-menu ul.header-top-nav {
        text-align: center;
    }

    /* Form Css */
    .login-input-head {
        padding-left: 0;
    }
    .login-input-head p {
        padding-bottom: 0;
    }
    .login-title {
        padding: 30px 0;
    }
    .login-input-area, .login-textarea-area {
        margin-right: 0;
    }

    /* Hide non-essential elements */
    .col-lg-5.col-md-5.col-sm-0.col-xs-12 {
        display: none;
    }
    .col-lg-3.col-md-3.col-sm-12.col-xs-12.desplay-n-tablet {
        display: none;
    }
    .desplay-n-tablet-pro {
        display: none;
    }

    /* Adjust message info width */
    ul.message-list-menu li .message-info {
        width: 311px;
    }

    /* Daily feed adjustments */
    .daily-feed-content {
        padding-bottom: 70px;
    }
    .daily-feed-content .message-feed-single {
        margin: 15px 0 0 175px;
    }

    /* Knob single adjustments */
    .knob-single {
        margin-bottom: 20px;
    }

    /* Input mask title alignment */
    .input-mask-title {
        text-align: left;
    }

    /* Alert success adjustments */
    .alert-success-style1::after, 
    .alert-success-style2::after, 
    .alert-success-style3::after, 
    .alert-success-style4::after {
        right: 70px;
    }

    /* Margin adjustments */
    .ant-res-t-30 {
        margin-top: 30px;
    }
    .basic-ele-mg-b-10 {
        margin-bottom: 10px;
    }
    .basic-ele-mg-t-20 {
        margin-top: 20px;
    }
    .basic-res-b-30 {
        margin-bottom: 30px;
    }
    .basic-ds-n {
        display: none;
    }

    /* Pull right adjustments */
    .pull-right.pull-right-pro {
        float: left !important;
    }

    /* Additional margin adjustments */
    .ntn-b-mg-30, 
    .c3-b-mg-30, 
    .code-b-mg-30, 
    .compose-b-mg-30, 
    .ct-map-b-mg-30, 
    .ct-google-map-b-mg-30, 
    .ln-ch-mg-b, 
    .md-mg-modal-b, 
    .password-mt-b, 
    .peity-mg-b-30, 
    .preloader-mg-b-30, 
    .profile-res-mg-b-30 {
        margin-bottom: 30px;
    }

    /* Profile adjustments */
    .profile-time-ds-none {
        display: none;
    }
    .progress-circular, 
    .progress-circular1 {
        text-align: center;
    }
    .user-profile-comment-input {
        margin-top: 10px;
    }
    .profile-online-mg-t-30 {
        margin-top: 30px;
    }
    .profile-user-post-content p {
        margin: 0 0 15px 0;
    }
    .profile-details-name-nn {
        display: none;
    }

    /* Tab content adjustments */
    .tab-content.res-tab-content-project {
        margin-top: 15px;
    }
    .user-profile-comment-img.projuct-details-img-tab {
        text-align: left;
        margin-bottom: 10px;
    }

    /* Additional margin adjustments */
    .rating-project-respons {
        margin-top: 20px;
    }
    .round-mg-t-30-gl, 
    .sparkel-pro-mg-t-30, 
    .widget-ov-mg-t-l-30 {
        margin-top: 30px;
    }

    /* Hide table elements */
    .tabl-d-n {
        display: none;
    }

    /* Dark layout adjustments */
    .darklayout .knob-single input {
        right: 130px;
    }
}

/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {
    /* Hide header top menu */
    .header-top-menu {
        display: none;
    }
    .mobile-menu-area {
        display: block;
    }

    /* Header adjustments */
    .admin-logo {
        text-align: center;
        margin-top: 10px;
    }
    .buy-button {
        text-align: center;
        margin-bottom: 20px;
    }

    /* Accordion adjustments */
    .responsive-accordion {
        margin-bottom: 30px !important;
    }

    /* Form adjustments */
    .login-input-head {
        padding-left: 0;
    }
    .login-input-head p {
        padding-bottom: 0;
    }
    .login-title {
        padding: 30px 0;
    }
    .login-input-area, .login-textarea-area {
        margin-right: 0;
    }

    /* Hide main menu area */
    .main-menu-area {
        display: none;
    }

    /* Margin adjustments */
    .res-mg-t {
        margin-top: 40px;
    }
    .res-mg-t-30 {
        margin-top: 30px;
    }

    /* Message info adjustments */
    ul.message-list-menu li .message-info {
        width: 84%;
    }

    /* Dashboard adjustments */
    .dashone-adminprowrap.shadow-reset.mg-b-30 {
        text-align: center;
    }
    .dashone-doughnut {
        padding: 0 295px;
    }

    /* Hide non-essential elements */
    .col-lg-5.col-md-5.col-sm-0.col-xs-12 {
        display: none;
    }

    /* Admin logo adjustments */
    .admin-logo {
        margin-top: 0;
        text-align: left;
    }

    /* Header right menu adjustments */
    .header-right-info ul.header-right-menu li .admintab-wrap.menu-setting-wrap.dropdown-menu,
    .header-right-info ul.header-right-menu li .author-message-top,
    .header-right-info ul.header-right-menu li .notification-author,
    .header-right-info ul.header-right-menu li .author-log {
        z-index: 9999999999;
    }

    /* Mobile menu adjustments */
    .mobile-menu-area .mean-container a.meanmenu-reveal {
        padding: 13px 0 11px;
    }

    /* Daily feed adjustments */
    .daily-feed-content .message-feed-single {
        margin: 15px 0 0 130px;
    }
    .daily-feed-content {
        padding-bottom: 70px;
    }

    /* Knob single adjustments */
    .knob-single {
        margin-bottom: 20px;
    }

    /* Input mask title alignment */
    .input-mask-title {
        text-align: left;
    }

    /* Alert success adjustments */
    .alert-success-style1::after, 
    .alert-success-style2::after, 
    .alert-success-style3::after, 
    .alert-success-style4::after {
        right: 51px;
    }

    /* Margin adjustments */
    .ant-res-b-30 {
        margin-bottom: 30px;
    }
    .ant-res-b-30.ant-res-b-nt-30,
    .ant-res-b-30.ant-res-b2-30 {
        margin-bottom: 0;
    }
    .basic-ele-mg-b-10 {
        margin-bottom: 10px;
    }
    .basic-ele-mg-t-20 {
        margin-top: 20px;
    }
    .basic-res-b-30 {
        margin-bottom: 30px;
    }
    .basic-ds-n {
        display: none;
    }

    /* Pull right adjustments */
    .pull-right.pull-right-pro {
        float: left !important;
    }

    /* Additional margin adjustments */
    .ntn-b-mg-30, 
    .c3-b-mg-30, 
    .code-b-mg-30, 
    .compose-b-mg-30, 
    .ct-client-b-mg-30, 
    .ct-map-b-mg-30, 
    .ct-google-map-b-mg-30, 
    .ln-ch-mg-b, 
    .md-mg-modal-b, 
    .password-mt-b, 
    .peity-mg-b-30, 
    .preloader-mg-b-30, 
    .profile-res-mg-b-30 {
        margin-bottom: 30px;
    }

    /* Profile adjustments */
    .profile-time-ds-none {
        display: none;
    }
    .progress-circular, 
    .progress-circular1 {
        text-align: center;
    }
    .user-profile-comment-input {
        margin-top: 10px;
    }
    .profile-online-mg-t-30 {
        margin-top: 30px;
    }
    .profile-user-post-content p {
        margin: 0 0 15px 0;
    }
    .profile-details-name-nn {
        display: none;
    }

    /* Tab content adjustments */
    .tab-content.res-tab-content-project {
        margin-top: 15px;
    }
    .user-profile-comment-img.projuct-details-img-tab {
        text-align: left;
        margin-bottom: 10px;
    }

    /* Additional margin adjustments */
    .project-details-mg-t-30 {
        margin-top: 30px;
    }
    .rating-project-respons {
        margin-top: 20px;
    }
    .round-mg-t-30-gl, 
    .sparkel-pro-mg-t-30, 
    .view-mail-ov-mg-t-30, 
    .widget-ov-mg-t-n-30 {
        margin-top: 30px;
    }

    /* Progress circular adjustments */
    .progress-circular4, 
    .progress-circular3, 
    .progress-circular2, 
    .progress-circular1 {
        text-align: center;
    }
}
/* Dark Layout Css */

.wrapper-pro {
    display: block;
}
#sidebarCollapse {
    display: none;
}
.fixed-header-top {
    position: relative;
}
.des-none {
    display: block;
}
.small-dn {
    display: none;
}
ul.message-list-menu li .message-time {
    float: right;
}
.logo-wrap-pro {
    display: block;
}
.mini-navbar .content-inner-all {
    margin-left: 0;
    transition: all 0.3s;
}
.content-inner-all {
    margin-left: 0;
    transition: all 0.3s;
}
.fixed-header-top {
    left: 0;
}
.darklayout .knob-single input {
    right: 120px;
}

/* Small mobile :320px. */
@media (max-width: 767px) {
    .container {
        width: 100%; /* Use percentage for better responsiveness */
        padding: 0 15px; /* Add padding for better spacing */
    }

    /* Header adjustments */
    .header-top-menu {
        display: none;
    }
    .mobile-menu-area {
        display: block;
    }
    .admin-logo {
        text-align: center;
        margin-top: 10px;
    }
    .buy-button {
        text-align: center;
        margin-bottom: 20px;
    }

    /* Accordion adjustments */
    .responsive-accordion {
        margin-bottom: 30px !important;
    }

    /* Button adjustments */
    .responsive-btn .btn,
    .responsive-btn .btn-button-ct {
        margin-bottom: 10px !important;
    }

    /* Form adjustments */
    .login-input-head {
        padding-left: 0;
    }
    .login-input-head p {
        padding-bottom: 0;
    }
    .login-title {
        padding: 30px 0;
    }
    .login-input-area, .login-textarea-area {
        margin-right: 0;
    }

    /* Dropzone adjustments */
    .dropzone-custom-sys, .tab-content-details {
        padding: 30px 20px;
    }

    /* Review adjustments */
    .review-title {
        text-align: center;
    }
    .review-rating {
        padding: 0 30px;
    }
    .login-button-pro {
        text-align: center;
    }

    /* Tabs adjustments */
    .nav-tabs.custom-menu-wrap li a {
        margin-bottom: 10px;
    }

    /* Dashboard v.1 adjustments */
    .header-right-info .admin-name {
        display: none;
    }
    .header-right-info .navbar-nav {
        float: none;
        padding: 17px 0;
        width: 100%;
        text-align: center;
    }
    .header-right-info ul.header-right-menu li .author-log {
        left: -65px;
    }
    .header-right-info ul.header-right-menu li .admintab-wrap.menu-setting-wrap.dropdown-menu {
        left: -196px;
        width: 307px;
    }
    .header-right-info ul.header-right-menu li .notification-author {
        left: -84px;
    }
    .header-right-info ul.header-right-menu li .author-message-top,
    .header-right-info ul.header-right-menu li .notification-author,
    .header-right-info ul.header-right-menu li .author-log {
        width: 307px;
    }
    .header-right-info .author-message-top::before {
        right: 63%;
    }
    .header-right-info ul.header-right-menu li .author-message-top {
        left: -78px;
    }
    .header-right-info .notification-author::before {
        right: 63%;
    }

    /* Main menu adjustments */
    .main-menu-area {
        display: none;
    }

    /* Margin adjustments */
    .res-mg-t {
        margin-top: 40px;
    }
    .res-mg-t-30 {
        margin-top: 30px;
    }
    .res-mg-b-10 {
        margin-bottom: 10px;
    }

    /* Message list adjustments */
    ul.message-list-menu li .message-time {
        text-align: right;
        width: 43%;
        display: block;
    }
    ul.message-list-menu li .message-info {
        width: 190px;
    }

    /* Header right menu adjustments */
    .header-right-info ul.header-right-menu li .admintab-wrap.menu-setting-wrap.dropdown-menu,
    .header-right-info ul.header-right-menu li .author-message-top,
    .header-right-info ul.header-right-menu li .notification-author,
    .header-right-info ul.header-right-menu li .author-log {
        z-index: 9999999999;
    }

    /* Dashboard adjustments */
    .dashone-doughnut {
        padding: 0 68px;
    }
    .datatable-dashv1-list .pull-right {
        text-align: center;
    }

    /* Timeline adjustments */
    .icon-date-timeline {
        text-align: center;
    }
    .timeline-content {
        padding: 15px 10px;
    }
    .mCSB_inside > .mCSB_container {
        margin-right: 15px;
    }
    .icon-date-timeline {
        border-right: 1px solid #ccc;
    }
    .timeline-content {
        border-left: 1px solid #ccc;
    }

    /* Mobile menu adjustments */
    .mobile-menu-area .mean-container a.meanmenu-reveal {
        padding: 13px 0 11px;
    }

    /* Custom datatable adjustments */
    .custom-datatable-overright .fixed-table-pagination div.pagination,
    .fixed-table-pagination .pagination-detail {
        margin-right: 5px;
    }

    /* Hide non-essential elements */
    .res-ds-n, .res-ds-n-t {
        display: none;
    }

    /* Daily feed adjustments */
    .daily-feed-content .message-feed-single {
        margin: 15px 0 0 30px;
    }

    /* Knob single adjustments */
    .knob-single {
        margin-bottom: 20px;
    }

    /* Input mask title alignment */
    .input-mask-title {
        text-align: left;
    }

    /* Alert success adjustments */
    .alert-success-style1 p,
    .alert-success-style2 p,
    .alert-success-style3 p,
    .alert-success-style4 p {
        margin: 0 20px 0 50px;
    }
    .alert-success-style1 .icon-sc-cl,
    .alert-success-style2 .icon-sc-cl,
    .alert-success-style3 .icon-sc-cl,
    .alert-success-style4 .icon-sc-cl {
        right: -10px;
    }

    /* Margin adjustments */
    .ant-res-b-30 {
        margin-bottom: 30px;
    }
    .basic-ele-mg-b-10 {
        margin-bottom: 10px;
    }
    .basic-ele-mg-t-20 {
        margin-top: 20px;
    }
    .basic-res-b-30 {
        margin-bottom: 30px;
    }
    .basic-ds-n {
        display: none;
    }

    /* Pull right adjustments */
    .pull-right.pull-right-pro {
        float: left !important;
    }

    /* Additional margin adjustments */
    .ntn-b-mg-30,
    .c3-b-mg-30,
    .code-b-mg-30,
    .compose-b-mg-30,
    .ct-client-b-mg-30,
    .ct-map-b-mg-30,
    .ct-google-map-b-mg-30,
    .ln-ch-mg-b,
    .md-mg-modal-b,
    .password-mt-b,
    .peity-mg-b-30,
    .preloader-mg-b-30,
    .profile-res-mg-b-30 {
        margin-bottom: 30px;
    }

    /* Profile adjustments */
    .profile-time-ds-none {
        display: none;
    }
    .progress-circular,
    .progress-circular1 {
        text-align: center;
    }
    .user-profile-comment-input {
        margin-top: 10px;
    }
    .profile-online-mg-t-30 {
        margin-top: 30px;
    }

    /* Project details adjustments */
    .project-details-mg {
        margin: 0 !important;
    }
    .project-details-st {
        text-align: left;
        margin-top: 20px;
    }
    .profile-details-name-nn {
        display: none;
    }

    /* Tab content adjustments */
    .tab-content.res-tab-content-project {
        margin-top: 15px;
    }
    .user-profile-comment-img.projuct-details-img-tab {
        text-align: left;
        margin-bottom: 10px;
    }

    /* Additional margin adjustments */
    .project-details-mg-t-30 {
        margin-top: 30px;
    }
    .rating-project-respons {
        margin-top: 20px;
    }
    .round-mg-t-30-gl,
    .sparkel-pro-mg-t-30,
    .view-mail-ov-mg-t-30,
    .widget-ov-mg-t-30 {
        margin-top: 30px;
    }

    /* Progress circular adjustments */
    .progress-circular4,
    .progress-circular3,
    .progress-circular2,
    .progress-circular1 {
        text-align: center;
    }

/* Dark Layout Css /* Base styling for the sidebar */
.left-sidebar-pro {
    display: block; /* Make the sidebar visible by default */
    width: 250px;
    position: fixed;
    height: 100%;
    z-index: 999;
    transition: all 0.3s ease;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.wrapper-pro {
    display: flex;
    width: 100%;
    position: relative;
}

/* Toggle button styling */
#sidebarCollapse {
    display: inline-block;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 10px;
}

.fixed-header-top {
    position: fixed;
    width: 100%;
    z-index: 998;
}

/* Responsive classes */
.des-none {
    display: none;
}

.small-dn {
    display: block;
}

/* Mobile menu styling */
.mobile-menu-area {
    display: none; /* Hide by default, show only on small screens */
}

/* Responsive Layout */
@media only screen and (max-width: 991px) {
    .left-sidebar-pro {
        width: 250px;
        left: -250px; /* Hide off-screen by default */
    }
    
    .left-sidebar-pro.active {
        left: 0; /* Show when active class is added */
    }
    
    #sidebarCollapse {
        display: block; /* Show toggle button on mobile */
    }
    
    .content-inner-all {
        margin-left: 0;
    }
    
    .mobile-menu-area {
        display: block;
    }
    
    .fixed-header-top {
        left: 0;
    }
}

/* Small Mobile devices */
@media only screen and (max-width: 479px) {
    .container {
        width: 100%;
        padding: 0 10px;
    }
    
    .breadcome-heading h2 {
        font-size: 16px;
    }
    
    .left-sidebar-pro.active {
        width: 50%; /* Make sidebar take most of the screen on very small devices */
    }
}

/* Medium Mobile devices */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container {
        width: 100%;
        padding: 0 15px;
    }
    
    .left-sidebar-pro.active {
        width: 300px; /* Fixed width for medium devices */
    }
}

/* Add overlay when sidebar is active */
.sidebar-overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 998;
    top: 0;
    left: 0;
}

.sidebar-overlay.active {
    display: block;
}

    /* Header adjustments */
    /* Mobile Header Optimization */
@media only screen and (max-width: 991px) {
    /* Hide the desktop header menu */
    .header-top-menu {
        display: none;
    }
    
    /* Style the mobile menu to be compact */
    .mobile-menu-area {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 999;
        max-height: 60px; /* Limit height to make it compact */
        background-color: #fff; /* Ensure background is visible */
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Add subtle shadow */
    }
    
    /* Mobile menu container styling */
    .mobile-menu-area .container {
        padding: 0 10px;
    }
    
    /* Mobile menu header bar styling */
    .mobile-menu-area .mean-bar {
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 15px;
    }
    
    /* Logo adjustments for mobile */
    .mobile-menu-area .logo-wrap-pro {
        max-height: 40px;
        padding: 10px 0;
    }
    
    .mobile-menu-area .logo-wrap-pro img {
        max-height: 30px;
        width: auto;
    }
    
    /* Push content below the fixed header */
    .content-inner-all {
        margin-top: 60px; /* Same as header height */
        width: 100%;
    }
    
    /* Fix overflow issues that might occur */
    body {
        overflow-x: hidden;
    }
    
    /* Compact toggle button */
    #sidebarCollapse {
        padding: 5px;
        margin: 0;
    }
    
    /* Compact notification icons if present */
    .header-right-info .nav.navbar-nav {
        height: 60px;
        padding: 10px 0;
        display: flex;
        align-items: center;
    }
    
    .header-right-info .nav.navbar-nav > li > a {
        padding: 5px;
    }
    
    /* Adjust review components to be more compact */
    .review-title {
        text-align: center;
        margin: 10px 0;
        font-size: 16px;
    }
    
    .review-rating {
        padding: 0 20px; /* Reduced from 110px */
    }
    
    /* Adjust message list */
    ul.message-list-menu li {
        padding: 10px;
    }
    
    ul.message-list-menu li .message-info {
        width: calc(100% - 80px); /* More responsive width */
    }
    
    ul.message-list-menu li .message-time {
        text-align: right;
        display: inline-block;
        width: auto;
        font-size: 12px;
    }
}

/* Smaller mobile devices */
@media only screen and (max-width: 479px) {
    .review-rating {
        padding: 0 10px; /* Even more compact padding */
    }
    
    ul.message-list-menu li .message-info {
        width: calc(100% - 60px); /* More space for message on very small screens */
    }
}

    /* Dashboard adjustments */
    .dash-adminpro-project-title {
        text-align: center;
    }
    .project-dashone-phara {
        text-align: center;
    }
    .dashone-doughnut {
        padding: 0 145px;
    }

    /* Daily feed adjustments */
    .daily-feed-content .message-feed-single {
        margin: 15px 0 0 90px;
    }
    .res-ds-n-t {
        display: block;
    }
    .daily-feed-content h4 {
        font-size: 16px;
    }

    /* Alert success adjustments */
    .alert-success-style1 .icon-sc-cl,
    .alert-success-style2 .icon-sc-cl,
    .alert-success-style3 .icon-sc-cl,
    .alert-success-style4 .icon-sc-cl {
        right: -5px;
    }

    /* Mail title adjustments */
    .mail-title h2 {
        text-align: left;
    }

    /* Compose email adjustments */
    .compose-email-to, .compose-multiple-email {
        text-align: left;
    }

    /* View mail action adjustments */
    .view-mail-action {
        display: block;
    }

    /* Table project adjustments */
    .table-project-n {
        display: inline-block;
    }

    /* View mail adjustments */
    .view-mail-ov-d-n {
        display: none;
    }

    /* Dark layout adjustments */
    .darklayout .knob-single input {
        right: 240px;
    }
}