/* Custom Wagtail Admin Styling */

/* Main sidebar container */
.sidebar,
.sidebar__inner,
.sidebar-loading__inner,
.sidebar-footer,
.sidebar-panel,
.sidebar-panel--visible,
.sidebar-panel--open,
.c-page-explorer__drawer,
.nav-wrapper,
[role="navigation"],
.sidebar-panel {
    background-color: #61366E !important;
}

/* All sidebar backgrounds */
.sidebar-wrapper {
    background-color: #61366E !important;
}

/* Navigation elements */
.sidebar nav,
.sidebar-nav,
nav.main-nav,
.nav-main {
    background-color: #61366E !important;
}

/* All links in sidebar */
.sidebar a,
.sidebar nav a,
.sidebar nav li a,
nav a,
.nav-main a,
.nav-main li a,
.sidebar-nav a,
.sidebar-nav li a,
.sidebar-panel a {
    color: #ffffff !important;
}

/* Sidebar text and headings */
.sidebar,
.sidebar-panel,
.sidebar nav,
.nav-main,
.sidebar-nav {
    color: #ffffff !important;
}

.sidebar h1,
.sidebar h2,
.sidebar h3,
.sidebar-panel h2,
.sidebar-panel h3,
nav h2,
nav h3 {
    color: #ffffff !important;
}

/* Hover states */
.sidebar a:hover,
.sidebar nav a:hover,
.sidebar nav li a:hover,
nav a:hover,
.nav-main a:hover,
.nav-main li a:hover,
.sidebar-nav a:hover,
.sidebar-nav li a:hover,
.sidebar-panel a:hover,
.sidebar-footer__account:hover {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
}

/* Active states */
.sidebar a.active,
.sidebar nav a.active,
.sidebar nav li a.active,
nav a.active,
.nav-main a.active,
.nav-main li.active > a,
.nav-main li.current > a,
.sidebar-nav a.active,
.sidebar-nav li a.active,
.sidebar-panel a.active,
.sidebar nav li.active > a,
.sidebar nav li.current > a,
.sidebar-footer__account.active {
    background-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

/* Menu items and list items */
.sidebar ul,
.sidebar li,
.nav-main ul,
.nav-main li,
.sidebar-nav ul,
.sidebar-nav li {
    background-color: #61366E !important;
    color: #ffffff !important;
}

/* Sidebar submenu panel */
.sidebar-sub-menu-panel {
    background-color: #61366E !important;
}

.sidebar-sub-menu-panel > h2 {
    color: #ffffff !important;
    background-color: #61366E !important;
}

.sidebar-sub-menu-panel > h2 * {
    color: #ffffff !important;
}
.sidebar ul li ul,
.sidebar nav ul li ul,
.nav-main ul li ul {
    background-color: #61366E !important;
}

.sidebar ul li ul *,
.sidebar nav ul li ul *,
.nav-main ul li ul * {
    color: #ffffff !important;
}

/* Sidebar icons */
.sidebar svg,
.sidebar i,
.nav-main svg,
.nav-main i,
.sidebar-nav svg,
.sidebar-nav i {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Focus states for accessibility */
.sidebar a:focus,
.sidebar nav a:focus,
nav a:focus {
    background-color: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
    outline-color: #ffffff !important;
}

/* Sidebar dividers and separators */
.sidebar hr,
.sidebar-nav hr,
.c-page-explorer__drawer hr,
nav hr {
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* Sidebar borders */
.sidebar,
.sidebar__inner,
.sidebar-loading__inner,
.sidebar-footer,
.sidebar-panel,
.sidebar-panel--visible,
.sidebar-panel--open,
.c-page-explorer__drawer {
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* Page explorer styling */
.c-page-explorer__item__link {
    border: none !important;
    color: #ffffff !important;
}

.c-page-explorer__item__link:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

.c-page-explorer__item__link.active,
.c-page-explorer__item__link.is-active {
    background-color: rgba(255, 255, 255, 0.15) !important;
}

/* Page explorer header title */
.c-page-explorer__header,
.c-page-explorer__header__title__inner {
    color: #ffffff !important;
}

.c-page-explorer__header * {
    color: #ffffff !important;
}

/* Breadcrumb styling */
.w-no-underline,
.w-text-text-label,
.c-page-explorer a {
    color: #d4a5e8 !important;
    text-decoration: none !important;
}

.w-border-b,
.w-border-transparent {
    border-color: transparent !important;
}

.hover\:w-border-current:hover,
.w-no-underline:hover,
.c-page-explorer a:hover {
    color: #e8c5f0 !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    text-decoration: none !important;
}
.sidebar .badge,
.sidebar .label,
.nav-main .badge,
.nav-main .label {
    background-color: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
}

/* Sidebar footer account button */
.sidebar-footer__account {
    background-color: #61366E !important;
    color: #ffffff !important;
}

.sidebar-footer__account-toggle {
    color: #ffffff !important;
}

.sidebar-footer__account-label {
    color: #ffffff !important;
}

.sidebar-footer__account svg,
.sidebar-footer__account i {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.sidebar-footer__account:focus {
    background-color: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
}

/* Ensure all descendant text is white */
.sidebar,
.sidebar__inner,
.sidebar-loading__inner,
.sidebar-footer,
.sidebar-panel,
.sidebar-panel--visible,
.sidebar-panel--open,
.c-page-explorer__drawer,
.nav-main,
.sidebar-nav {
    color: #ffffff !important;
}

.sidebar *,
.sidebar__inner *,
.sidebar-loading__inner *,
.sidebar-footer *,
.sidebar-panel *,
.sidebar-panel--visible *,
.sidebar-panel--open *,
.c-page-explorer__drawer *,
.nav-main *,
.sidebar-nav * {
    color: #ffffff !important;
}

/* Admin navigation bar */
.navbar-nav {
    background-color: #61366E !important;
}

.navbar-nav a {
    color: #ffffff !important;
}

/* Login Page Buttons */
.login button,
.login input[type="submit"],
.login input[type="button"],
button[type="submit"],
input[type="submit"],
.btn-primary,
button.primary {
    background-color: #61366E !important;
    color: #ffffff !important;
    border-color: #61366E !important;
}

.login button:hover,
.login input[type="submit"]:hover,
.login input[type="button"]:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.btn-primary:hover,
button.primary:hover {
    background-color: #4a2752 !important;
    color: #ffffff !important;
    border-color: #4a2752 !important;
}

.login button:focus,
.login input[type="submit"]:focus,
.login input[type="button"]:focus,
button[type="submit"]:focus,
input[type="submit"]:focus,
.btn-primary:focus,
button.primary:focus {
    background-color: #4a2752 !important;
    color: #ffffff !important;
    outline-color: #ffffff !important;
}

/* Secondary Buttons */
.button.button-secondary,
button.secondary,
.btn-secondary {
    background-color: #f5f1f8 !important;
    color: #61366E !important;
    border-color: #61366E !important;
}

.button.button-secondary:hover,
button.secondary:hover,
.btn-secondary:hover {
    background-color: #e8d5f2 !important;
    color: #61366E !important;
    border-color: #61366E !important;
}

.button.button-secondary:focus,
button.secondary:focus,
.btn-secondary:focus {
    background-color: #e8d5f2 !important;
    color: #61366E !important;
    border-color: #61366E !important;
    outline-color: #61366E !important;
}

/* Login Content Wrapper */
.login .content-wrapper,
.login-box,
.login form {
    background-color: #f5f1f8 !important;
}

.login .wrapper {
    {% comment %} background: linear-gradient(135deg, #61366E 0%, #4a2752 100%) !important; {% endcomment %}
    background: #edd9fb !important;
    min-height: 100vh !important;
}

.login .content-wrapper h1,
.login h1,
.login label,
.login .form-group label {
    color: #61366E !important;
}

.login .reset-password,
.login .reset-password a {
    color: #61366E !important;
}

.login .reset-password a:hover {
    color: #4a2752 !important;
    text-decoration: underline !important;
}

.login input[type="text"],
.login input[type="email"],
.login input[type="password"],
.login textarea {
    border-color: #61366E !important;
    background-color: #ffffff !important;
    color: #333333 !important;
    border-width: 2px !important;
    padding: 10px 12px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
}

.login input[type="text"]::placeholder,
.login input[type="email"]::placeholder,
.login input[type="password"]::placeholder,
.login textarea::placeholder {
    color: #999999 !important;
}

.login input[type="text"]:focus,
.login input[type="email"]:focus,
.login input[type="password"]:focus,
.login textarea:focus {
    border-color: #61366E !important;
    box-shadow: 0 0 0 4px rgba(97, 54, 110, 0.15) !important;
    background-color: #ffffff !important;
    outline: none !important;
}

.login input[type="text"]:hover,
.login input[type="email"]:hover,
.login input[type="password"]:hover,
.login textarea:hover {
    border-color: #4a2752 !important;
}

/* Checkbox styling */
.login input[type="checkbox"],
input[type="checkbox"] {
    accent-color: #61366E !important;
    cursor: pointer !important;
    width: 18px !important;
    height: 18px !important;
    background-color: transparent !important;
    background: none !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
}

.login input[type="checkbox"]:hover,
input[type="checkbox"]:hover {
    opacity: 0.8 !important;
}

.login input[type="checkbox"]:focus,
input[type="checkbox"]:focus {
    outline: 2px solid #61366E !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
}

/* Link styling */
a,
a:link,
a:visited {
    color: #61366E !important;
    text-decoration: none !important;
}

a:hover,
a:active {
    color: #4a2752 !important;
    text-decoration: underline !important;
}

a:focus {
    color: #4a2752 !important;
    outline: 2px solid #61366E !important;
    outline-offset: 2px !important;
}

/* Listing children links */
.listing .children a,
.listing .children a:link,
.listing .children a:visited {
    color: #61366E !important;
}

.listing .children a:hover,
.listing .children a:active {
    color: #4a2752 !important;
    background-color: rgba(97, 54, 110, 0.1) !important;
}

/* Sidebar links already defined above, make sure they stay white */
.sidebar a,
.sidebar nav a,
.sidebar nav li a,
nav a,
.nav-main a,
.nav-main li a,
.sidebar-nav a,
.sidebar-nav li a,
.sidebar-panel a,
.c-page-explorer a {
    color: #ffffff !important;
}
.messages .success,
.message.success,
.alert-success {
    background-color: #f0e6f8 !important;
    border-color: #61366E !important;
    color: #61366E !important;
}

.messages .success a,
.message.success a,
.alert-success a {
    color: #4a2752 !important;
}

.messages .success button,
.message.success button,
.alert-success button {
    background-color: #61366E !important;
    color: #ffffff !important;
}

.messages .success button:hover,
.message.success button:hover,
.alert-success button:hover {
    background-color: #4a2752 !important;
}

/* Slim header action button */
.w-slim-header-action-button,
.w-slim-header-action-button a {
    color: #61366E !important;
}

.w-slim-header-action-button:hover,
.w-slim-header-action-button a:hover {
    color: #4a2752 !important;
    background-color: rgba(97, 54, 110, 0.1) !important;
}

.w-slim-header-action-button:focus,
.w-slim-header-action-button a:focus {
    color: #4a2752 !important;
    outline: 2px solid #61366E !important;
}
.pagination li.pagination__page-number a,
.pagination a {
    color: #61366E !important;
    border-color: #61366E !important;
}

.pagination li.pagination__page-number a:hover,
.pagination a:hover {
    background-color: #f0e6f8 !important;
    color: #61366E !important;
    border-color: #61366E !important;
}

.pagination li.pagination__page-number.pagination__page-number--current a,
.pagination li.active a {
    background-color: #61366E !important;
    color: #ffffff !important;
    border-color: #61366E !important;
}

.pagination li.pagination__page-number.pagination__page-number--current a:hover,
.pagination li.active a:hover {
    background-color: #4a2752 !important;
    color: #ffffff !important;
    border-color: #4a2752 !important;
}

