/*
Template Name: AncestryCodex - Admin & Dashboard Template
Author: AncestryCodex
Website: https://ancestrycodex.com/
Contact: support@ancestrycodex.com
File: Custom Css File
*/

/* ============================================
   Dark Mode Global Styles
   ============================================ */

/* Footer dark mode styles */
[data-bs-theme="dark"] .footer {
    background: #212529;
    border-top-color: #3e4349;
}

[data-bs-theme="dark"] .footer .text-muted {
    color: #878a99 !important;
}

[data-bs-theme="dark"] .footer .text-muted:hover {
    color: #ced4da !important;
}

/* Powered by badge - teal/green style */
[data-bs-theme="dark"] .footer .badge.bg-primary-subtle {
    background: rgba(10, 179, 156, 0.2) !important;
    color: #5fd4c2 !important;
}

[data-bs-theme="dark"] .footer .badge.bg-primary-subtle:hover {
    background: rgba(10, 179, 156, 0.3) !important;
}

/* Version badge */
[data-bs-theme="dark"] .footer .badge.bg-secondary-subtle {
    background: rgba(135, 138, 153, 0.2) !important;
    color: #9ca3af !important;
}

/* ============================================
   Topbar Guest User Buttons
   ============================================ */

/* Dark mode styles for guest action buttons in topbar */
[data-bs-theme="dark"] .header-item .btn-soft-primary {
    background: rgba(10, 179, 156, 0.15);
    color: #5fd4c2;
    border-color: transparent;
}

[data-bs-theme="dark"] .header-item .btn-soft-primary:hover {
    background: rgba(10, 179, 156, 0.25);
    color: #5fd4c2;
}

[data-bs-theme="dark"] .header-item .btn-primary {
    background: #0ab39c;
    border-color: #0ab39c;
    color: #fff;
}

[data-bs-theme="dark"] .header-item .btn-primary:hover {
    background: #099885;
    border-color: #099885;
}

/* ============================================
   Google Translate Customization
   ============================================ */

/* Hide Google Translate top bar/banner */
.goog-te-banner-frame,
.skiptranslate,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip {
    display: none !important;
}

body {
    top: 0 !important;
}

/* Hide the "Translate" attribution text that appears */
.goog-logo-link {
    display: none !important;
}

.goog-te-gadget {
    color: transparent !important;
    font-size: 0 !important;
}

/* Fix body positioning when Google Translate adds top padding */
html.translated-ltr,
html.translated-rtl {
    margin-top: 0 !important;
}

html.translated-ltr body,
html.translated-rtl body {
    margin-top: 0 !important;
    padding-top: 0 !important;
    top: 0 !important;
}

/* Hide the popup that shows original text on hover */
.goog-te-menu-value span:first-child {
    display: none;
}

.goog-te-menu2 {
    max-width: 100%;
}

/* Style adjustments for translated content */
font[style] {
    background: inherit !important;
    box-shadow: none !important;
}

/* ============================================
   Horizontal Menu Dark Mode Fixes
   ============================================ */

/* Fix horizontal menu links visibility in dark mode - all variations */
[data-bs-theme="dark"] .app-menu .navbar-nav .nav-link,
[data-bs-theme="dark"] .app-menu .navbar-nav .nav-link span,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link span,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .menu-link,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .menu-link span {
    color: #ced4da !important;
}

[data-bs-theme="dark"] .app-menu .navbar-nav .nav-link:hover,
[data-bs-theme="dark"] .app-menu .navbar-nav .nav-link:hover span,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link:hover,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link:hover span,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .menu-link:hover,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .menu-link:hover span {
    color: #fff !important;
}

[data-bs-theme="dark"] .app-menu .navbar-nav .nav-link.active,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link.active,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .menu-link.active {
    color: #0ab39c !important;
}

[data-bs-theme="dark"] .app-menu .navbar-nav .nav-link i,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link i,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .menu-link i {
    color: #ced4da !important;
}

[data-bs-theme="dark"] .app-menu .navbar-nav .nav-link:hover i,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link:hover i,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .menu-link:hover i {
    color: #fff !important;
}

/* Submenu items in dark mode */
[data-bs-theme="dark"] .app-menu .navbar-nav .nav-sm .nav-link,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-sm .nav-link,
[data-bs-theme="dark"] .navbar-menu .menu-dropdown .nav-link {
    color: #adb5bd !important;
}

[data-bs-theme="dark"] .app-menu .navbar-nav .nav-sm .nav-link:hover,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-sm .nav-link:hover,
[data-bs-theme="dark"] .navbar-menu .menu-dropdown .nav-link:hover {
    color: #fff !important;
}

[data-bs-theme="dark"] .navbar-menu .menu-dropdown,
[data-bs-theme="dark"] .app-menu .menu-dropdown {
    background-color: #212529 !important;
    border-color: #3e4349 !important;
}

/* Light mode horizontal menu - ensure good contrast */
[data-bs-theme="light"] .app-menu .navbar-nav .nav-link,
[data-bs-theme="light"] .navbar-menu .navbar-nav .nav-link,
[data-bs-theme="light"] .navbar-menu .navbar-nav .menu-link {
    color: #495057 !important;
}

[data-bs-theme="light"] .app-menu .navbar-nav .nav-link:hover,
[data-bs-theme="light"] .navbar-menu .navbar-nav .nav-link:hover,
[data-bs-theme="light"] .navbar-menu .navbar-nav .menu-link:hover {
    color: #212529 !important;
}

[data-bs-theme="light"] .app-menu .navbar-nav .nav-link.active,
[data-bs-theme="light"] .navbar-menu .navbar-nav .nav-link.active,
[data-bs-theme="light"] .navbar-menu .navbar-nav .menu-link.active {
    color: #0ab39c !important;
}

/* ============================================
   Story Page Styles
   ============================================ */

/* Story avatar in story header */
.story-avatar-lg {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--acx-border-color);
}

.story-avatar-placeholder-lg {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: var(--acx-tertiary-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid var(--acx-border-color);
}

.story-avatar-placeholder-lg i {
    font-size: 48px;
    color: var(--acx-secondary-color);
}

/* ============================================
   Dark Mode Purple to Light Purple Override
   ============================================ */

/* Primary/Purple text colors - make light purple in dark mode */
[data-bs-theme="dark"] .text-primary {
    color: #a78bfa !important;  /* Light purple */
}

[data-bs-theme="dark"] a.text-primary:hover {
    color: #c4b5fd !important;  /* Even lighter purple on hover */
}

/* Primary badges and backgrounds */
[data-bs-theme="dark"] .badge.bg-primary {
    background-color: #7c3aed !important;  /* Violet */
    color: #fff !important;
}

[data-bs-theme="dark"] .bg-primary-subtle {
    background-color: rgba(167, 139, 250, 0.15) !important;  /* Light purple subtle */
}

[data-bs-theme="dark"] .text-primary-emphasis {
    color: #c4b5fd !important;  /* Light purple emphasis */
}

/* Primary buttons in dark mode */
[data-bs-theme="dark"] .btn-primary {
    background-color: #7c3aed !important;
    border-color: #7c3aed !important;
}

[data-bs-theme="dark"] .btn-primary:hover {
    background-color: #6d28d9 !important;
    border-color: #6d28d9 !important;
}

[data-bs-theme="dark"] .btn-outline-primary {
    color: #a78bfa !important;
    border-color: #a78bfa !important;
}

[data-bs-theme="dark"] .btn-outline-primary:hover {
    background-color: #7c3aed !important;
    border-color: #7c3aed !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .btn-soft-primary {
    background-color: rgba(167, 139, 250, 0.15) !important;
    color: #a78bfa !important;
}

[data-bs-theme="dark"] .btn-soft-primary:hover {
    background-color: rgba(167, 139, 250, 0.25) !important;
    color: #c4b5fd !important;
}

/* Links with primary color */
[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item) {
    color: #a78bfa;
}

[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):hover {
    color: #c4b5fd;
}

/* Border primary */
[data-bs-theme="dark"] .border-primary {
    border-color: #a78bfa !important;
}

/* Progress bars */
[data-bs-theme="dark"] .progress-bar.bg-primary {
    background-color: #7c3aed !important;
}

/* Pagination */
[data-bs-theme="dark"] .page-link {
    color: #a78bfa;
}

[data-bs-theme="dark"] .page-item.active .page-link {
    background-color: #7c3aed;
    border-color: #7c3aed;
}

/* Form focus states */
[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    border-color: #a78bfa;
    box-shadow: 0 0 0 0.25rem rgba(167, 139, 250, 0.25);
}

/* Nav pills/tabs active */
[data-bs-theme="dark"] .nav-pills .nav-link.active {
    background-color: #7c3aed !important;
}

[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    border-color: #a78bfa !important;
    color: #a78bfa !important;
}

/* Alerts */
[data-bs-theme="dark"] .alert-primary {
    background-color: rgba(167, 139, 250, 0.15) !important;
    border-color: rgba(167, 139, 250, 0.3) !important;
    color: #c4b5fd !important;
}

/* List group items */
[data-bs-theme="dark"] .list-group-item.active {
    background-color: #7c3aed !important;
    border-color: #7c3aed !important;
}

/* Dropdown active items */
[data-bs-theme="dark"] .dropdown-item.active,
[data-bs-theme="dark"] .dropdown-item:active {
    background-color: #7c3aed !important;
}