/* Avatar initials styles */
.avatar-initials {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

.avatar-initials-dropdown {
    width: 40px;
    height: 40px;
}

/* API Console / Swagger UI Theme Integration */
.swagger-ui {
    font-family: inherit !important;
}

.swagger-ui .topbar {
    display: none !important;
}

.swagger-ui .info {
    margin: 0 0 20px 0 !important;
}

.swagger-ui .info .title {
    color: var(--primary) !important;
    font-size: 2rem !important;
    font-weight: 600 !important;
}

.swagger-ui .scheme-container {
    background: rgba(var(--primary-rgb), 0.05) !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-bottom: 20px !important;
    border: 1px solid rgba(var(--primary-rgb), 0.1) !important;
}

.swagger-ui .opblock {
    border-radius: 8px !important;
    margin-bottom: 15px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
}

.swagger-ui .opblock .opblock-summary {
    border-radius: 8px 8px 0 0 !important;
}

.swagger-ui .btn {
    border-radius: 6px !important;

/* Download Page Styles */
.download-form .form-check {
    padding: 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    margin-bottom: 0.75rem;
    transition: all 0.15s ease-in-out;
}

.download-form .form-check:hover {
    background-color: #f8f9fa;
    border-color: #adb5bd;
}

.download-form .form-check-input:checked + .form-check-label {
    color: #0d6efd;
}

.download-form .btn-group .btn {
    min-width: 120px;
}

.download-form .card {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.download-form .alert {
    border: none;
    border-radius: 0.5rem;
}

/* Notification Badge Styles */
.notification-badge {
    font-size: 0.65rem !important;
    min-width: 16px !important;
    height: 16px !important;
    padding: 2px 4px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
}

/* Cron Log View Styling */
.cron-log-view .card {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.cron-log-view .card-header {
    border-radius: 8px 8px 0 0 !important;
    font-weight: 600;
}

/* Custom status colors to match site theme */
.cron-log-view .border-success,
.cron-log-view .bg-success {
    border-color: #198754 !important;
    background-color: #198754 !important;
}

.cron-log-view .border-danger,
.cron-log-view .bg-danger {
    border-color: #dc3545 !important;
    background-color: #dc3545 !important;
}

.cron-log-view .border-warning,
.cron-log-view .bg-warning {
    border-color: #ffc107 !important;
    background-color: #ffc107 !important;
    color: #000 !important;
}

.cron-log-view .border-info,
.cron-log-view .bg-info {
    border-color: var(--primary) !important;
    background-color: var(--primary) !important;
}

.cron-log-view .alert-success {
    background-color: rgba(25, 135, 84, 0.1) !important;
    border-color: rgba(25, 135, 84, 0.2) !important;
    color: #0f5132 !important;
}

.cron-log-view .alert-danger {
    background-color: rgba(220, 53, 69, 0.1) !important;
    border-color: rgba(220, 53, 69, 0.2) !important;
    color: #721c24 !important;
}

.cron-log-view .alert-warning {
    background-color: rgba(255, 193, 7, 0.1) !important;
    border-color: rgba(255, 193, 7, 0.2) !important;
    color: #664d03 !important;
}

.cron-log-view .alert-info {
    background-color: rgba(var(--primary-rgb), 0.1) !important;
    border-color: rgba(var(--primary-rgb), 0.2) !important;
    color: var(--primary-dark) !important;
}

.cron-log-view .btn-primary {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.cron-log-view .btn-primary:hover {
    background-color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
}
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
}

.swagger-ui .btn.authorize {
    background-color: var(--success) !important;
    border-color: var(--success) !important;
}

.swagger-ui .btn.authorize:hover {
    background-color: var(--success) !important;
    border-color: var(--success) !important;
    opacity: 0.9;
}

.swagger-ui input[type=text], .swagger-ui input[type=password], .swagger-ui textarea {
    border-radius: 6px !important;
    border: 1px solid rgba(0,0,0,0.2) !important;
    font-family: inherit !important;
}

.swagger-ui input[type=text]:focus, .swagger-ui input[type=password]:focus, .swagger-ui textarea:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.2) !important;
}

/* Dark mode support for Swagger UI */
[data-theme="dark"] .swagger-ui {
    filter: invert(1) hue-rotate(180deg);
}

[data-theme="dark"] .swagger-ui img {
    filter: invert(1) hue-rotate(180deg);
}

/* Fix for sprite.svg icons visibility */
.sa-icon {
    --sa-icon-color: currentColor !important;
    --sa-icon-fill: none !important;
    stroke: currentColor !important;
    fill: none !important;
}

/* Ensure proper visibility in header buttons */
.app-header .sa-icon {
    --sa-icon-color: #495057 !important;
    stroke: #495057 !important;
}

/* Dark mode support for icons */
[data-bs-theme="dark"] .sa-icon,
[data-theme="dark"] .sa-icon {
    --sa-icon-color: #ffffff !important;
    stroke: #ffffff !important;
}

[data-bs-theme="dark"] .app-header .sa-icon,
[data-theme="dark"] .app-header .sa-icon {
    --sa-icon-color: #ffffff !important;
    stroke: #ffffff !important;
}

/* Specific visibility fixes for button states */
.btn:hover .sa-icon,
.btn.show .sa-icon {
    --sa-icon-color: currentColor !important;
    stroke: currentColor !important;
}

/* Mobile menu button icon fix */
.mobile-menu-icon .sa-icon {
    --sa-icon-color: #495057 !important;
    stroke: #495057 !important;
}

/* Notification dropdown styling */
.notification-dropdown {
    min-width: 320px;
    max-width: 380px;
    width: 380px;
    max-height: 400px;
    overflow-y: auto;
    padding: 0;
}

/* Ensure dropdown doesn't overflow viewport */
@media (max-width: 480px) {
    .notification-dropdown {
        width: 320px;
        max-width: calc(100vw - 20px);
    }
}

.dropdown-menu .sa-icon {
    width: 1rem;
    height: 1rem;
}

.dropdown-item:hover .sa-icon {
    --sa-icon-color: currentColor !important;
    stroke: currentColor !important;
}

/* Notification badge positioning */
.btn .badge {
    font-size: 0.65em;
    min-width: 1.2em;
    height: 1.2em;
    line-height: 1.2;
}

/* Notification dropdown content */
.notification-dropdown .dropdown-item {
    padding: 0.75rem 1rem;
    border: none;
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.notification-dropdown .dropdown-item:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

.notification-dropdown .notification-item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.notification-dropdown .notification-item:last-of-type {
    border-bottom: none;
}

/* Notification item content */
.notification-dropdown .notification-item .flex-grow-1 {
    min-width: 0; /* Allow flex item to shrink */
    overflow: hidden;
}

.notification-dropdown .notification-item .fw-semibold {
    font-size: 0.875rem;
    line-height: 1.3;
    margin-bottom: 0.25rem;
    word-break: break-word;
}

.notification-dropdown .notification-item small {
    font-size: 0.75rem;
    line-height: 1.2;
    display: block;
    word-break: break-word;
}

.dropdown-menu .dropdown-header {
    padding: 0.75rem 1rem 0.5rem;
    font-weight: 600;
}

.dropdown-menu .dropdown-divider {
    margin: 0;
}

/* Dark mode support for notifications */
[data-bs-theme="dark"] .notification-dropdown,
[data-theme="dark"] .notification-dropdown {
    background-color: #212529;
    border-color: rgba(255, 255, 255, 0.15);
}

/* Ensure dropdown functionality */
.dropdown {
    position: relative;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    min-width: 160px;
    padding: 0.5rem 0;
    margin: 0;
    font-size: 0.875rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
}

.dropdown-menu.show {
    display: block;
}

/* Header dropdown positioning */
.app-header .dropdown-menu {
    right: 0;
    left: auto;
}

[data-bs-theme="dark"] .notification-dropdown .dropdown-item:hover,
[data-theme="dark"] .notification-dropdown .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.08);
}

[data-bs-theme="dark"] .notification-dropdown .notification-item,
[data-theme="dark"] .notification-dropdown .notification-item {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* Header system buttons icon sizing */
.header-icon {
    font-size: 16px !important;
}

/* Logout form styling */
.logout-form {
    margin: 0;
}

.logout-button {
    width: 100%;
    border: none;
    background: none;
    padding-left: 16px;
}

/* DataTables Font Fix - Match Application Font Weight */
.dataTables_wrapper,
.dataTables_wrapper table,
.dataTables_wrapper table tbody td {
    font-family: inherit !important;
    font-weight: inherit !important;
    font-size: inherit !important;
}

/* DataTable Headers - Bold */
.dataTables_wrapper table thead th {
    font-family: inherit !important;
    font-weight: 600 !important;
    font-size: inherit !important;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    font-family: inherit !important;
    font-weight: inherit !important;
}

/* Fix View Button - Match Sidebar Color */
.api-log-index .btn-primary,
.cron-log-index .btn-primary,
.api-users-list .btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border: none !important;
    color: white !important;
    font-weight: bold;
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
    transition: all 0.3s ease;
}

.api-log-index .btn-primary:hover,
.cron-log-index .btn-primary:hover,
.api-users-list .btn-primary:hover {
    background: linear-gradient(135deg, #5a6fd8 0%, #6a4190 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
    color: white !important;
    text-decoration: none !important;
}