/* Auto-generated global styles */

.app_styles_1 {
    background-color: #ffc107; color: #000;
}

.app_styles_2 {
    background-color: #17a2b8; color: #fff;
}

.app_styles_3 {
    background-color: #28a745; color: #fff;
}

.app_styles_4 {
    background-color: #dc3545; color: #fff;
}

.app_styles_5 {
    background-color: #6c757d; color: #fff;
}

.app_styles_6 {
    background-color: #a7cdd8;
}

.app_styles_7 {
    color: black;
}

.app_styles_8 {
    background: linear-gradient(135deg, #cdced3ff 0%, #cdced3ff 100%); color: white;
}

.app_styles_9 {
    background-color: #f8f9fa; padding: 30px 40px;
}

.app_styles_10 {
    position: relative; padding-left: 5px; width: 100%;
}

.app_styles_11 {
    position: relative; padding-bottom: 35px; width: 100%;
}

.app_styles_12 {
    border-left: 4px solid @if($remark->flow_status_id == 1) #667eea @elseif($remark->flow_status_id == 2) #11998e @elseif($remark->flow_status_id == 3) #eb3349 @else #f093fb @endif ; border-radius: 8px; transition: transform 0.2s, box-shadow 0.2s; width: 100%;
}

.app_styles_13 {
    padding: 25px 30px;
}

.app_styles_14 {
    display: flex; align-items: center; gap: 12px;
}

.app_styles_15 {
    width: 45px; height: 45px; border-radius: 50%; background: linear-gradient(135deg, #9fa0a5ff 0%, #9fa0a5ff 100%); display: flex; align-items: center; justify-content: center; color: white; font-weight: bold; font-size: 18px;
}

.app_styles_16 {
    font-weight: 600; color: #2c3e50; font-size: 15px;
}

.app_styles_17 {
    font-size: 12px; color: #7f8c8d;
}

.app_styles_18 {
    font-size: 13px; color: #7f8c8d;
}

.app_styles_19 {
    font-size: 12px; color: #95a5a6;
}

.app_styles_20 {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 16px; border-radius: 20px; background: linear-gradient(135deg, #667eea 0%, #667eea 100%); color: white; font-weight: 500; font-size: 13px;
}

.app_styles_21 {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 16px; border-radius: 20px; background: linear-gradient(135deg, #11998e 0%, #11998e 100%); color: white; font-weight: 500; font-size: 13px;
}

.app_styles_22 {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 16px; border-radius: 20px; background: linear-gradient(135deg, #eb3349 0%, #f45c43 100%); color: white; font-weight: 500; font-size: 13px;
}

.app_styles_23 {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 16px; border-radius: 20px; background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); color: white; font-weight: 500; font-size: 13px;
}

.app_styles_24 {
    background-color: #f8f9fa; padding: 18px 20px; border-radius: 8px; border-left: 3px solid #e0e0e0;
}

.app_styles_25 {
    font-weight: 600; color: #34495e; margin-bottom: 10px; font-size: 14px;
}

.app_styles_26 {
    color: #5a6c7d; line-height: 1.7; font-size: 14px;
}

.app_styles_27 {
    background-color: #f5f6fa;
}

.app_styles_28 {
    display: none;
}

.app_styles_29 {
    display:inline-block;
}

.app_styles_30 {
    color: red; padding-right: 15px;
}

.app_styles_31 {
    color: red;
}

.app_styles_32 {
    float:right;
}

.app_styles_33 {
    background-color: #fca242 !important; color: #ffffff;
}

.app_styles_34 {
    background-color: #f8f9fa; color: #007bff; font-weight: bold;
}

.app_styles_35 {
    background-color: #f8f9fa; color: #28a745; font-weight: bold;
}

.app_styles_36 {
    background-color: #f8f9fa; color: #ffc107; font-weight: bold;
}

.app_styles_37 {
    padding-left: 5px;
}

.app_styles_38 {
    font-size: 0.6em;
}

.app_styles_39 {
    color:black;float:left;font-size:20px;
}

.app_styles_40 {
    color:green;
}

.app_styles_41 {
    color:red;
}

.app_styles_42 {
    display:none;
}

.app_styles_43 {
    float:right;width:100px;
}

.app_styles_44 {
    float:right;width:auto;
}

.app_styles_45 {
    margin:10px 20px;
}

.app_styles_46 {
    height:20px;
}

.app_styles_47 {
    text-align: jusify;
}

.app_styles_48 {
    float:right;text-align: left;
}

.app_styles_49 {
    color:red;
}

.app_styles_50 {
    break-before: page;
}

.app_styles_51 {
    height:auto;
}

.app_styles_52 {
    width: 100%;border-collapse: collapse;
}

.app_styles_53 {
    font-size:14px; background: #fff;border:1px solid #004778;
}

.app_styles_54 {
    font-size:15px;
}

.app_styles_55 {
    color:#6576ff;
}

.app_styles_56 {
    overflow-x: auto;
}

.app_styles_57 {
    margin:0 5px;
}

.app_styles_58 {
    color:black;font-size:23px;
}

.app_styles_59 {
    height:10px;
}

.app_styles_60 {
    text-align: justify;
}

.app_styles_61 {
    page-break-before: always;
}

.app_styles_62 {
    text-align: center;
}

.app_styles_63 {
    max-width: 200px; display: inline-block;
}

.app_styles_64 {
    width:100%;
}

.app_styles_65 {
    overflow-x:auto;margin-top:10px;
}

.app_styles_66 {
    display: block; width: 100%; max-width: 100%;
}

.app_styles_67 {
    vertical-align: top;
}

.app_styles_68 {
    font-size: 12px;
}

.app_styles_69 {
    color:#6576ff;float:right;
}

.app_styles_70 {
    width:150px !important;
}

.app_styles_71 {
    color:#6576ff;
}

.app_styles_72 {
    background-color: #aac1e0;
}

.app_styles_73 {
    color:blue;
}

.app_styles_74 {
    background-color:{{$clr}};
}

.app_styles_75 {
    color:{{$clr=='yellow' ? 'black':'white';}};
}

.app_styles_76 {
    color:black;
}

.app_styles_77 {
    color:#1b1818;text-align:center;
}

.app_styles_78 {
    background-color:{{$clr_gen}};
}

.app_styles_79 {
    color:{{$clr_gen=='yellow' ? 'black':'white';}};
}

.app_styles_80 {
    border-bottom: #1a3272;
}

.app_styles_81 {
    background-color:{{$clr_med}};
}

.app_styles_82 {
    color:{{$clr_med=='yellow' ? 'black':'white';}};
}

.app_styles_83 {
    background-color:{{$clr_tech}};
}

.app_styles_84 {
    color:{{$clr_tech=='yellow' ? 'black':'white';}};
}

.app_styles_85 {
    background-color:{{$clr_mbb}};
}

.app_styles_86 {
    color:{{$clr_mbb=='yellow' ? 'black':'white';}};
}

.app_styles_87 {
    height: 450px; overflow-y: auto; padding: 20px; background: linear-gradient(to bottom, #f8f9fa 0%, #ffffff 100%);
}

.app_styles_88 {
    border-radius: 12px; border: 2px solid #e5e9f2; resize: none;
}

.app_styles_89 {
    border-radius: 20px; padding: 8px 24px;
}

.app_styles_90 {
    font-size: 3rem; opacity: 0.3;
}

.app_styles_91 {
    display: block; margin-bottom: ${message.message ? '15px' : '0'};
}

.app_styles_92 {
    border-radius: 12px;
}

.app_styles_93 {
    max-width: 70%;
}

.app_styles_94 {
    padding: 12px 16px; border-radius: 18px; ${isOwnMessage ? 'border-bottom-right-radius: 6px;' : 'border-bottom-left-radius: 6px;'} box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.app_styles_95 {
    display: block;
}

.app_styles_96 {
    text-align: ${isOwnMessage ? 'right' : 'left'};
}

.app_styles_97 {
    font-size: 10px; margin-left: ${isOwnMessage ? '0' : '12px'}; margin-right: ${isOwnMessage ? '12px' : '0'};
}

.app_styles_98 {
    background:white;padding:15px;border:1px solid #ccc;margin-bottom:20px;
}

.app_styles_99 {
    background:white;padding:20px;border:1px solid #ccc;margin-top:20px;
}

.app_styles_100 {
    font-size:12px;color:#666;margin-top:10px;
}

.app_styles_101 {
    background:white;padding:15px;border:1px solid #ccc;
}

.app_styles_102 {
    margin-left: 350px;
}

.app_styles_103 {
    font-size: 0.5em; min-width: 16px; height: 16px; padding: 0 4px;
}

.app_styles_104 {
    width: 30px;
}

.app_styles_105 {
    width:100px; height:50px;
}

.app_styles_106 {
    margin-bottom: 40px;
}

.app_styles_107 {
    width: 50px;
}

.app_styles_108 {
    max-width: 400px;
}

.app_styles_109 {
    max-width: 100px;
}

.app_styles_110 {
    height: 5px;
}

.app_styles_111 {
    width: 33%;
}

.app_styles_112 {
    width: 66%;
}

.app_styles_113 {
    width: 100%;
}

.app_styles_114 {
    border: 2px solid #6c757d !important;
}

.app_styles_115 {
    background-color: #f8f9fa; border-bottom: 2px solid #6c757d !important;
}

.app_styles_116 {
    border: 0px solid #6c757d !important; border-top: none !important;
}

.app_styles_117 {
    border: 2px solid #007bff !important;
}

.app_styles_118 {
    background-color: #f8f9fa; border-bottom: 2px solid #007bff !important;
}

.app_styles_119 {
    border: 0px solid #007bff !important; border-top: none !important;
}

.app_styles_120 {
    border: 2px solid #28a745 !important;
}

.app_styles_121 {
    background-color: #f8f9fa; border-bottom: 2px solid #28a745 !important;
}

.app_styles_122 {
    border: 0px solid #28a745 !important; border-top: none !important;
}

.app_styles_123 {
    border: 2px solid #ffc107 !important;
}

.app_styles_124 {
    background-color: #f8f9fa; border-bottom: 2px solid #ffc107 !important;
}

.app_styles_125 {
    border: 0px solid #ffc107 !important; border-top: none !important;
}

.app_styles_126 {
    width: 100%;
}

.app_styles_127 {
    background-color: white;
}

.app_styles_128 {
    width: 100%; max-height: 300px; overflow-y: auto;
}

.app_styles_129 {
    cursor: pointer;
}

.app_styles_130 {
    display: inline-block; background-color: #e85347; color: white; border-radius: 50%; width: 24px; height: 24px; text-align: center; line-height: 24px; font-size: 12px; font-weight: bold;
}

.app_styles_131 {
    height: 400px; overflow-y: auto; padding: 15px; background-color: #f8f9fa;
}

.app_styles_132 {
    padding: 12px 16px; border-radius: 18px; {{ $message['is_own_message'] ? 'border-bottom-right-radius: 6px;' : 'border-bottom-left-radius: 6px;' }} box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.app_styles_133 {
    text-align: {{ $message['is_own_message'] ? 'right' : 'left' }};
}

.app_styles_134 {
    font-size: 10px; margin-left: {{ $message['is_own_message'] ? '0' : '12px' }}; margin-right: {{ $message['is_own_message'] ? '12px' : '0' }};
}

.app_styles_135 {
    font-size: 10px; margin-left: 12px;
}

.app_styles_136 {
    font-size: 2rem; opacity: 0.3;
}

.app_styles_137 {
    border-top: 1px solid #e5e9f2;
}

.app_styles_138 {
    border-radius: 20px; resize: none; border: 1px solid #e5e9f2;
}

.app_styles_139 {
    border-radius: 12px; border: 1px solid #e5e9f2;
}

.app_styles_140 {
    width: 25%;
}

.app_styles_141 {
    width: 50%;
}

.app_styles_142 {
    width: 75%;
}

.app_styles_143 {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(15, 23, 42, 0.65) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 99999 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    margin: 0 !important;
    padding: 1rem !important;
    box-sizing: border-box !important;
}

.app_styles_143 .modal-dialog {
    position: relative !important;
    width: 100% !important;
    max-width: 800px !important;
    margin: auto !important;
    pointer-events: auto !important;
    z-index: 100000 !important;
    transform: none !important;
}

.app_styles_143 .modal-content {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-height: 85vh !important;
    background-color: #ffffff !important;
    background-clip: padding-box !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    border-radius: 12px !important;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2), 0 10px 10px -5px rgba(0, 0, 0, 0.1) !important;
    overflow: hidden !important;
    pointer-events: auto !important;
}

.app_styles_143 .modal-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 1.25rem 1.5rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background-color: #f8fafc !important;
}

.app_styles_143 .modal-header .close,
.app_styles_143 .modal-header .btn-close {
    padding: 0.5rem !important;
    margin: -0.5rem -0.5rem -0.5rem auto !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    color: #64748b !important;
    opacity: 0.75 !important;
    cursor: pointer !important;
    transition: opacity 0.15s ease-in-out, color 0.15s ease-in-out !important;
}

.app_styles_143 .modal-header .close:hover,
.app_styles_143 .modal-header .btn-close:hover {
    color: #0f172a !important;
    opacity: 1 !important;
}

.app_styles_143 .modal-body {
    position: relative !important;
    flex: 1 1 auto !important;
    padding: 1.5rem !important;
    overflow-y: auto !important;
    max-height: calc(85vh - 130px) !important;
}

.app_styles_143 .modal-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 1rem 1.5rem !important;
    border-top: 1px solid #e2e8f0 !important;
    background-color: #f8fafc !important;
}

.app_styles_144 {
    font-size: 0.600rem;
}

.app_styles_145 {
    width: {{ $uploadProgress }}%;
}

.app_styles_146 {
    width: 250px;
}

.app_styles_147 {
    max-height: 400px; overflow-y: auto;
}

.app_styles_148 {
    font-size: 4rem; color: #28a745;
}

.app_styles_149 {
    display: {{ $isUpdateMode ? 'flex' : 'none' }}; flex-direction: column; gap: 0.5rem;
}

.app_styles_150 {
    display: {{ !$isUpdateMode ? 'block' : 'none' }};
}

.app_styles_151 {
    display: {{ $showUpdateBtn ? 'block' : 'none' }};
}

.app_styles_152 {
    display: {{ !$showUpdateBtn ? 'block' : 'none' }};
}

.app_styles_153 {
    width:80px;
}

.app_styles_154 {
    font-size: 48px;
}

.app_styles_155 {
    float:right;width=;
}

.app_styles_156 {
    width:100px;height:50px;
}

.app_styles_157 {
    margin-top: 50px; border-top: 1px solid #ccc; padding-top: 10px;
}

.app_styles_158 {
    font-size: 10px; color: #666;
}

.app_styles_159 {
    float: left; width: 50%;
}

.app_styles_160 {
    float: right; width: 50%; text-align: right;
}

.app_styles_161 {
    x-overflow:auto;
}

.app_styles_162 {
    margin-left:50px;
}

.app_styles_163 {
    overflow-x:auto;
}

.app_styles_164 {
    float:center;
}

.app_styles_165 {
    padding:5px;margin:5px;
}

.app_styles_166 {
    vertical-align: top !important;
}

.app_styles_167 {
    height:20px;
}

.app_styles_168 {
    height:50px;
}

.app_styles_169 {
    font-size: 25px;
}

.app_styles_170 {
    font-size: 15px;
}

.app_styles_171 {
    white-space: pre-wrap !important;
}

.app_styles_172 {
    white-space: pre-wrap !important;vertical-align: top !important;
}

.app_styles_173 {
    white-space: nowrap;
}

.app_styles_174 {
    overflow-x: auto;
}

.status-bg-red {
    background-color: red;
}

.status-bg-green {
    background-color: green;
}

.status-bg-yellow {
    background-color: yellow;
}

.chat-file-has-message {
    display: block;
    margin-bottom: 15px;
}

.chat-file-no-message {
    display: block;
    margin-bottom: 0;
}

.chat-bubble-base {
    padding: 12px 16px;
    border-radius: 18px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.chat-bubble-own {
    border-bottom-right-radius: 6px;
}

.chat-bubble-other {
    border-bottom-left-radius: 6px;
}

.chat-align-right {
    text-align: right;
}

.chat-align-left {
    text-align: left;
}

.chat-meta-own {
    font-size: 10px;
    margin-left: 0;
    margin-right: 12px;
}

.chat-meta-other {
    font-size: 10px;
    margin-left: 12px;
    margin-right: 0;
}

.update-mode-flex {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.progress-width-0 { width: 0%; }
.progress-width-1 { width: 1%; }
.progress-width-2 { width: 2%; }
.progress-width-3 { width: 3%; }
.progress-width-4 { width: 4%; }
.progress-width-5 { width: 5%; }
.progress-width-6 { width: 6%; }
.progress-width-7 { width: 7%; }
.progress-width-8 { width: 8%; }
.progress-width-9 { width: 9%; }
.progress-width-10 { width: 10%; }
.progress-width-11 { width: 11%; }
.progress-width-12 { width: 12%; }
.progress-width-13 { width: 13%; }
.progress-width-14 { width: 14%; }
.progress-width-15 { width: 15%; }
.progress-width-16 { width: 16%; }
.progress-width-17 { width: 17%; }
.progress-width-18 { width: 18%; }
.progress-width-19 { width: 19%; }
.progress-width-20 { width: 20%; }
.progress-width-21 { width: 21%; }
.progress-width-22 { width: 22%; }
.progress-width-23 { width: 23%; }
.progress-width-24 { width: 24%; }
.progress-width-25 { width: 25%; }
.progress-width-26 { width: 26%; }
.progress-width-27 { width: 27%; }
.progress-width-28 { width: 28%; }
.progress-width-29 { width: 29%; }
.progress-width-30 { width: 30%; }
.progress-width-31 { width: 31%; }
.progress-width-32 { width: 32%; }
.progress-width-33 { width: 33%; }
.progress-width-34 { width: 34%; }
.progress-width-35 { width: 35%; }
.progress-width-36 { width: 36%; }
.progress-width-37 { width: 37%; }
.progress-width-38 { width: 38%; }
.progress-width-39 { width: 39%; }
.progress-width-40 { width: 40%; }
.progress-width-41 { width: 41%; }
.progress-width-42 { width: 42%; }
.progress-width-43 { width: 43%; }
.progress-width-44 { width: 44%; }
.progress-width-45 { width: 45%; }
.progress-width-46 { width: 46%; }
.progress-width-47 { width: 47%; }
.progress-width-48 { width: 48%; }
.progress-width-49 { width: 49%; }
.progress-width-50 { width: 50%; }
.progress-width-51 { width: 51%; }
.progress-width-52 { width: 52%; }
.progress-width-53 { width: 53%; }
.progress-width-54 { width: 54%; }
.progress-width-55 { width: 55%; }
.progress-width-56 { width: 56%; }
.progress-width-57 { width: 57%; }
.progress-width-58 { width: 58%; }
.progress-width-59 { width: 59%; }
.progress-width-60 { width: 60%; }
.progress-width-61 { width: 61%; }
.progress-width-62 { width: 62%; }
.progress-width-63 { width: 63%; }
.progress-width-64 { width: 64%; }
.progress-width-65 { width: 65%; }
.progress-width-66 { width: 66%; }
.progress-width-67 { width: 67%; }
.progress-width-68 { width: 68%; }
.progress-width-69 { width: 69%; }
.progress-width-70 { width: 70%; }
.progress-width-71 { width: 71%; }
.progress-width-72 { width: 72%; }
.progress-width-73 { width: 73%; }
.progress-width-74 { width: 74%; }
.progress-width-75 { width: 75%; }
.progress-width-76 { width: 76%; }
.progress-width-77 { width: 77%; }
.progress-width-78 { width: 78%; }
.progress-width-79 { width: 79%; }
.progress-width-80 { width: 80%; }
.progress-width-81 { width: 81%; }
.progress-width-82 { width: 82%; }
.progress-width-83 { width: 83%; }
.progress-width-84 { width: 84%; }
.progress-width-85 { width: 85%; }
.progress-width-86 { width: 86%; }
.progress-width-87 { width: 87%; }
.progress-width-88 { width: 88%; }
.progress-width-89 { width: 89%; }
.progress-width-90 { width: 90%; }
.progress-width-91 { width: 91%; }
.progress-width-92 { width: 92%; }
.progress-width-93 { width: 93%; }
.progress-width-94 { width: 94%; }
.progress-width-95 { width: 95%; }
.progress-width-96 { width: 96%; }
.progress-width-97 { width: 97%; }
.progress-width-98 { width: 98%; }
.progress-width-99 { width: 99%; }
.progress-width-100 { width: 100%; }

.timeline-card-forward {
    border-left: 4px solid #667eea;
    border-radius: 8px;
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
}

.timeline-card-approved {
    border-left: 4px solid #11998e;
    border-radius: 8px;
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
}

.timeline-card-rejected {
    border-left: 4px solid #eb3349;
    border-radius: 8px;
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
}

.timeline-card-query {
    border-left: 4px solid #f093fb;
    border-radius: 8px;
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
}

/* ==========================================================================
   THEME STYLE OVERRIDES (LANDING PAGE COHESIVE PALETTE)
   ========================================================================== */

/* 1. Sidebar (Dashboard Menu) Elevated UI & Theme Overrides */
.nk-sidebar,
.nk-sidebar.is-light,
.nk-sidebar.is-dark {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 50%, #f1f5f9 100%) !important;
    border-right: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: 4px 0 24px rgba(7, 29, 82, 0.04) !important;
}

.nk-sidebar-element.nk-sidebar-head,
.nk-sidebar-head {
    background: transparent !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
    height: 70px !important;
}

/* Sidebar branding logo text - Modern Gradient Typography */
.nk-sidebar-logo,
.nk-sidebar-brand .logo-text,
.nk-sidebar-brand a {
    background: linear-gradient(135deg, #071d52 0%, #2d8262 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 800 !important;
    font-size: 19px !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    display: inline-block !important;
}

/* Sidebar menu heading - Modern Accent Badge */
.overline-title.text-primary-alt,
.overline-title {
    color: #2d8262 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
    margin-top: 14px !important;
    margin-bottom: 6px !important;
    padding-left: 14px !important;
    opacity: 0.9 !important;
}

/* Sidebar Floating Pill Navigation Items */
.nk-menu-link {
    color: #52617d !important;
    margin: 3px 12px !important;
    border-radius: 10px !important;
    padding: 10px 14px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
}

.nk-menu-link:hover {
    color: #071d52 !important;
    background: linear-gradient(135deg, rgba(45, 130, 98, 0.08) 0%, rgba(0, 119, 182, 0.06) 100%) !important;
    transform: translateX(4px) !important;
    box-shadow: 0 4px 12px rgba(7, 29, 82, 0.04) !important;
}

.nk-menu-item.active > .nk-menu-link,
.nk-menu-item.current-menu-item > .nk-menu-link,
.nk-menu-item.has-sub.active > .nk-menu-link {
    color: #071d52 !important;
    background: linear-gradient(135deg, #ffffff 0%, rgba(45, 130, 98, 0.14) 100%) !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 14px rgba(45, 130, 98, 0.12), inset 0 0 0 1px rgba(45, 130, 98, 0.2) !important;
    border-left: 4px solid #2d8262 !important;
}

/* Sidebar menu icons with Micro-animations */
.nk-menu-icon {
    transition: transform 0.25s ease !important;
}

.nk-menu-icon em {
    color: #8094ae !important;
    transition: all 0.25s ease !important;
}

.nk-menu-link:hover .nk-menu-icon {
    transform: scale(1.1) !important;
}

.nk-menu-link:hover .nk-menu-icon em,
.nk-menu-item.active > .nk-menu-link .nk-menu-icon em,
.nk-menu-item.current-menu-item > .nk-menu-link .nk-menu-icon em,
.nk-menu-item.has-sub.active > .nk-menu-link .nk-menu-icon em {
    color: #2d8262 !important;
}

/* Sidebar Sub-Menus - Glassmorphism Card Effect */
.nk-menu-sub {
    background: rgba(241, 245, 249, 0.75) !important;
    backdrop-filter: blur(8px) !important;
    border-radius: 12px !important;
    margin: 4px 12px 8px 20px !important;
    padding: 6px !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02) !important;
}

.nk-menu-sub .nk-menu-link {
    color: #64748b !important;
    margin: 2px 0 !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
}

.nk-menu-sub .nk-menu-link:hover,
.nk-menu-sub .nk-menu-item.active > .nk-menu-link {
    color: #071d52 !important;
    background: rgba(45, 130, 98, 0.12) !important;
    box-shadow: none !important;
    border-left: none !important;
}

.nk-menu-item.active > .nk-menu-link::before {
    background-color: rgb(45, 130, 98) !important;
}

/* Compact View Mode Icon Toggle */
.nk-nav-compact,
.nk-nav-toggle {
    color: #2d8262 !important;
}

/* Simplebar Scrollbar Styling */
.simplebar-scrollbar::before {
    background-color: rgba(7, 29, 82, 0.2) !important;
    border-radius: 10px !important;
}

/* Ambient Page Body Background */
body.nk-body.bg-lighter,
.nk-body.bg-lighter {
    background: #f8fafc !important;
    background-image: 
        radial-gradient(at 0% 0%, rgba(0, 180, 216, 0.05) 0px, transparent 50%),
        radial-gradient(at 100% 0%, rgba(45, 130, 98, 0.06) 0px, transparent 50%),
        radial-gradient(at 50% 100%, rgba(7, 29, 82, 0.03) 0px, transparent 50%) !important;
    background-attachment: fixed !important;
}


/* 2. Dashboard Header Theme Overrides */
.nk-header.is-light {
    background: #ffffff !important;
    border-bottom: 1px solid rgba(11, 41, 49, 0.1) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
}

.nk-quick-nav-icon,
.nk-nav-toggle,
.nk-menu-trigger a {
    color: rgb(45, 130, 98) !important;
}

.nk-quick-nav-icon:hover,
.nk-nav-toggle:hover,
.nk-menu-trigger a:hover {
    color: #58A78A !important;
    background-color: rgba(45, 130, 98, 0.08) !important;
}

/* Header User Indicator */
.user-avatar.sm,
.user-avatar {
    background-color: rgb(45, 130, 98) !important;
    color: #ffffff !important;
}

.user-name {
    color: rgb(45, 130, 98) !important;
    font-weight: 600 !important;
}

.user-status {
    color: #58A78A !important;
}

.dropdown-indicator::after {
    color: rgb(45, 130, 98) !important;
}

/* User Card / Profile Dropdown */
.dropdown-menu-s1 {
    border-top: 3px solid rgb(45, 130, 98) !important;
}

.user-card-wrap {
    background-color: rgba(45, 130, 98, 0.05) !important;
}

.user-card .user-avatar {
    background-color: rgb(17, 121, 81) !important;
}

.user-card .lead-text {
    color: #0b2931 !important;
    font-weight: 600 !important;
}

.link-list a {
    color: rgb(45, 130, 98) !important;
}

.link-list a:hover {
    color: #58A78A !important;
    background-color: rgba(45, 130, 98, 0.08) !important;
}

.link-list a em {
    color: rgb(45, 130, 98) !important;
}

.link-list a:hover em {
    color: #58A78A !important;
}


/* 3. Dashboard Footer Theme Overrides */
.nk-footer {
    background-color: #ffffff !important;
    padding: 20px 0 !important;
    border-top: 1px solid #e5e9f2 !important;
}

.nk-footer-copyright {
    color: #526484 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 0.5px !important;
}

.nk-footer-copyright a {
    color: rgb(45, 130, 98) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.nk-footer-copyright a:hover {
    color: #58A78A !important;
    text-decoration: underline !important;
}

/* 4. Auth Pages Scroll Override */
.pg-auth,
.pg-auth body,
.pg-auth .nk-app-root,
.pg-auth .nk-main,
.pg-auth .nk-wrap,
.pg-auth .nk-content {
    overflow-y: auto !important;
    min-height: 100vh !important;
    height: auto !important;
}