/* Permission Management Styles */
 .permission-tree {
     max-height: 60vh;
     overflow-y: auto;
     padding-right: 10px;
 }

 .permission-tree::-webkit-scrollbar {
     width: 8px;
 }

 .permission-tree::-webkit-scrollbar-track {
     background: #f1f1f1;
     border-radius: 10px;
 }

 .permission-tree::-webkit-scrollbar-thumb {
     background: #888;
     border-radius: 10px;
 }

 .permission-tree::-webkit-scrollbar-thumb:hover {
     background: #555;
 }

 .menu-item {
     border-left: 3px solid #6c757d;
     padding-left: 10px;
     margin-bottom: 15px;
 }

 .menu-item .card-header {
     background-color: rgba(0, 123, 255, 0.1);
 }

 .submenu-container {
     background-color: #f8f9fa;
     border-radius: 5px;
     padding: 10px;
     margin-top: 5px;
 }

 .custom-control-label::before,
 .custom-control-label::after {
     top: 0.25rem;
 }

 .switch {
     position: relative;
     display: inline-block;
     width: 50px;
     height: 24px;
 }

 .switch input {
     opacity: 0;
     width: 0;
     height: 0;
 }

 .slider {
     position: absolute;
     cursor: pointer;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background-color: #ccc;
     transition: .4s;
     border-radius: 34px;
 }

 .slider:before {
     position: absolute;
     content: "";
     height: 16px;
     width: 16px;
     left: 4px;
     bottom: 4px;
     background-color: white;
     transition: .4s;
     border-radius: 50%;
 }

 input:checked+.slider {
     background-color: #28a745;
 }

 input:checked+.slider:before {
     transform: translateX(26px);
 }

 /* Status toggle button styles */
 .status-toggle {
     min-width: 120px;
     transition: all 0.3s ease;
     border: none;
     border-radius: 4px;
     padding: 5px 10px;
     font-weight: 500;
 }

 .status-toggle:hover {
     transform: translateY(-2px);
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 }

 .btn-available {
     background-color: #28a745;
     color: white;
 }

 .btn-not-available {
     background-color: #dc3545;
     color: white;
 }

 /* Modal styles */
 .modal-header {
     padding: 12px 20px;
 }

 .modal-title {
     font-weight: 600;
 }

 #statusReason {
     min-height: 100px;
     resize: vertical;
 }

 .loading-text {
     font-size: 1.1rem;
     color: #6c757d;
 }

 .permission-btn {
     white-space: nowrap;
 }