[data-theme-toggle] {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(124, 77, 224, 0.16);
    border-radius: 12px;
    color: #2b1149;
    background: rgba(255, 255, 255, 0.64);
    box-shadow: 0 8px 20px rgba(77, 46, 123, 0.12);
    cursor: pointer;
    font: inherit;
    font-size: 21px;
    line-height: 1;
    transition: transform 0.25s ease, color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}

[data-theme-toggle]:hover {
    transform: translateY(-2px) rotate(-8deg);
    color: #6032b2;
    background: #fff;
    box-shadow: 0 12px 26px rgba(109, 60, 176, 0.2), 0 0 18px rgba(255, 255, 255, 0.8);
}

html[data-theme="dark"] [data-theme-toggle] {
    border-color: rgba(213, 194, 255, 0.18);
    color: #f7f2ff;
    background: rgba(158, 114, 242, 0.12);
}

html[data-theme="dark"] [data-theme-toggle]:hover {
    color: #fff;
    background: rgba(158, 114, 242, 0.22);
    box-shadow: 0 10px 24px rgba(109, 60, 176, 0.25), 0 0 18px rgba(191, 160, 255, 0.18);
}

html[data-theme="dark"] body {
    background-color: #10091d;
}

html[data-theme="dark"] body:has(.hero) {
    color: #f7f2ff;
    background:
        radial-gradient(circle at 80% 0%, rgba(135, 80, 229, 0.34), transparent 32%),
        radial-gradient(circle at 10% 80%, rgba(49, 142, 169, 0.16), transparent 28%),
        linear-gradient(135deg, #10091d, #1b1030 52%, #261344);
}

html[data-theme="dark"] body:has(.hero) .navbar {
    background: rgba(26, 15, 43, 0.82);
    border-color: rgba(214, 193, 255, 0.14);
}

html[data-theme="dark"] body:has(.hero) .brand,
html[data-theme="dark"] body:has(.hero) h1,
html[data-theme="dark"] body:has(.hero) .stat-item strong {
    color: #f7f2ff;
}

html[data-theme="dark"] body:has(.hero) .hero-text,
html[data-theme="dark"] body:has(.hero) .stat-item span {
    color: #a99bbf;
}

html[data-theme="dark"] body:has(.hero) .secondary-btn,
html[data-theme="dark"] body:has(.hero) .stat-item {
    color: #f7f2ff;
    background: rgba(36, 21, 59, 0.7);
    border-color: rgba(214, 193, 255, 0.14);
}

html[data-theme="dark"] body:has(.hero) .gallery {
    background: linear-gradient(135deg, rgba(64, 37, 112, 0.96), rgba(35, 20, 65, 0.96));
}

html[data-theme="dark"] body:has(.hero) .footer {
    background: linear-gradient(135deg, #090510, #160827 50%, #211039);
}

html[data-theme="dark"] body:has(.seatmap) {
    color: #f7f2ff;
    background:
        radial-gradient(circle at 12% 8%, rgba(135, 80, 229, 0.3), transparent 25%),
        radial-gradient(circle at 88% 18%, rgba(49, 142, 169, 0.16), transparent 26%),
        linear-gradient(135deg, #10091d, #1b1030 52%, #261344);
}

html[data-theme="dark"] body:has(.seatmap) .navbar {
    background: rgba(26, 15, 43, 0.82);
    border-color: rgba(214, 193, 255, 0.14);
}

html[data-theme="dark"] body:has(.seatmap) #welcome-card {
    color: #f7f2ff;
    background: rgba(36, 21, 59, 0.72);
    border-color: rgba(214, 193, 255, 0.14);
}

html[data-theme="dark"] body:has(.seatmap) .seatmap-actions button,
html[data-theme="dark"] body:has(.seatmap) #loginBtn,
html[data-theme="dark"] body:has(.seatmap) #logoutBtn {
    box-shadow: 0 10px 24px rgba(5, 2, 12, 0.3);
}

html[data-theme="dark"] body:has(.notifications-container) .notification-permission,
html[data-theme="dark"] body:has(.notifications-container) .notification-item {
    border-color: rgba(214, 193, 255, 0.14);
    background: linear-gradient(145deg, rgba(44, 26, 70, 0.88), rgba(25, 14, 42, 0.9));
}

html[data-theme="dark"] body:has(.notifications-container) h1,
html[data-theme="dark"] body:has(.notifications-container) .notification-permission strong,
html[data-theme="dark"] body:has(.notifications-container) .notification-item h2 {
    color: #f7f2ff;
}

html[data-theme="dark"] body:has(.notifications-container) .welcome-description,
html[data-theme="dark"] body:has(.notifications-container) .notification-permission p,
html[data-theme="dark"] body:has(.notifications-container) .notification-item p,
html[data-theme="dark"] body:has(.notifications-container) .empty-state {
    color: #a99bbf;
}

html[data-theme="light"] body:has(.profile-container) {
    color: #2e1f47;
    background:
        radial-gradient(circle at 85% 8%, rgba(255, 255, 255, 0.86), transparent 30%),
        radial-gradient(circle at 10% 90%, rgba(120, 204, 255, 0.2), transparent 30%),
        linear-gradient(135deg, #f6f0ff, #e7dcff 48%, #cdb4ff);
}

html[data-theme="light"] body:has(.profile-container) .profile-topbar {
    border-color: rgba(255, 255, 255, 0.58);
    background: rgba(255, 255, 255, 0.46);
    box-shadow: 0 20px 60px rgba(77, 46, 123, 0.14);
}

html[data-theme="light"] body:has(.profile-container) .profile-brand,
html[data-theme="light"] body:has(.profile-container) .profile-intro h1,
html[data-theme="light"] body:has(.profile-container) .profile-identity-content h2,
html[data-theme="light"] body:has(.profile-container) .profile-side-card h2,
html[data-theme="light"] body:has(.profile-container) .profile-security-card h2,
html[data-theme="light"] body:has(.profile-container) .profile-data-item strong {
    color: #2b1149;
}

html[data-theme="light"] body:has(.profile-container) .back-button {
    border-color: rgba(124, 77, 224, 0.15);
    color: #6b6080;
    background: rgba(255, 255, 255, 0.48);
}

html[data-theme="light"] body:has(.profile-container) .profile-intro-description,
html[data-theme="light"] body:has(.profile-container) .profile-identity-content p:last-child,
html[data-theme="light"] body:has(.profile-container) .profile-side-card p:not(.eyebrow),
html[data-theme="light"] body:has(.profile-container) .profile-security-card p:not(.eyebrow),
html[data-theme="light"] body:has(.profile-container) .status-text {
    color: #6b6080;
}

html[data-theme="light"] body:has(.profile-container) .profile-main-card,
html[data-theme="light"] body:has(.profile-container) .profile-side-card,
html[data-theme="light"] body:has(.profile-container) .profile-security-card {
    border-color: rgba(255, 255, 255, 0.58);
    background: rgba(255, 255, 255, 0.42);
    box-shadow: 0 24px 60px rgba(77, 46, 123, 0.14);
}

html[data-theme="light"] body:has(.profile-container) .profile-card-label,
html[data-theme="light"] body:has(.profile-container) .data-label,
html[data-theme="light"] body:has(.profile-container) .profile-role-label,
html[data-theme="light"] body:has(.profile-container) .access-line {
    color: #6b6080;
}

html[data-theme="light"] body:has(.profile-container) .profile-data-item {
    border-color: rgba(124, 77, 224, 0.12);
    background: rgba(255, 255, 255, 0.42);
}

html[data-theme="light"] body:has(.profile-container) .profile-divider,
html[data-theme="light"] body:has(.profile-container) .access-line {
    border-color: rgba(124, 77, 224, 0.14);
}

html[data-theme="dark"] body:has(.profile-container) {
    background:
        radial-gradient(circle at 85% 8%, rgba(125, 70, 196, 0.26), transparent 32%),
        radial-gradient(circle at 10% 90%, rgba(52, 83, 151, 0.18), transparent 34%),
        linear-gradient(135deg, #10091d, #171027 48%, #0c0a18);
}

html[data-theme="dark"] body:has(.profile-container) .profile-main-card,
html[data-theme="dark"] body:has(.profile-container) .profile-side-card,
html[data-theme="dark"] body:has(.profile-container) .profile-security-card {
    background: linear-gradient(135deg, rgba(62, 35, 91, 0.78), rgba(26, 16, 43, 0.84));
}

html[data-theme="dark"] body:has(.profile-container) .profile-brand,
html[data-theme="dark"] body:has(.profile-container) .profile-intro h1,
html[data-theme="dark"] body:has(.profile-container) .profile-identity-content h2,
html[data-theme="dark"] body:has(.profile-container) .profile-side-card h2,
html[data-theme="dark"] body:has(.profile-container) .profile-security-card h2,
html[data-theme="dark"] body:has(.profile-container) .profile-data-item strong {
    color: #f7f0ff;
}

html[data-theme="dark"] .topbar,
html[data-theme="dark"] .profile-topbar,
html[data-theme="dark"] .admin-topbar,
html[data-theme="dark"] .navbar {
    background-color: rgba(26, 15, 43, 0.82);
}

html[data-theme="dark"] .topbar .theme-toggle {
    color: #f7f2ff;
    background: rgba(158, 114, 242, 0.12);
}

html[data-theme="light"] .class-login-page,
html[data-theme="light"] body:has(.login-box) {
    color: #2e1f47;
    background:
        radial-gradient(circle at 10% 10%, rgba(255, 255, 255, 0.9), transparent 25%),
        radial-gradient(circle at 90% 90%, rgba(240, 138, 203, 0.2), transparent 28%),
        linear-gradient(135deg, #f6f0ff, #e7dcff 55%, #cdb4ff);
}

html[data-theme="light"] body:has(.login-box) .login-box {
    border-color: rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.58);
    box-shadow: 0 24px 60px rgba(77, 46, 123, 0.18);
    backdrop-filter: blur(18px);
}

html[data-theme="light"] body:has(.login-box) h1 {
    color: #2b1149;
}

html[data-theme="light"] body:has(.login-box) p {
    color: #6b6080;
}

html[data-theme="light"] body:has(.login-box) input {
    border-color: rgba(91, 58, 151, 0.16);
    color: #2e1f47;
    background: rgba(255, 255, 255, 0.72);
}

html[data-theme="light"] body:has(.login-box) button:not([data-theme-toggle]) {
    color: #fff;
    background: linear-gradient(135deg, #7c4de0, #44207a);
}

html[data-theme="dark"] body:has(.login-box) {
    background:
        radial-gradient(circle at 82% 0%, rgba(135, 80, 229, 0.34), transparent 31%),
        linear-gradient(135deg, #10091d, #1b1030 52%, #261344);
}

html[data-theme="dark"] body:has(.login-box) .login-box {
    border-color: rgba(214, 193, 255, 0.14);
    background: rgba(36, 21, 59, 0.78);
    box-shadow: 0 24px 70px rgba(5, 2, 12, 0.3);
}

html[data-theme="dark"] body:has(.login-box) h1 {
    color: #f7f2ff;
}

html[data-theme="dark"] body:has(.login-box) label {
    color: #d9c7ff;
}

html[data-theme="dark"] body:has(.login-box) input {
    border-color: rgba(214, 193, 255, 0.18);
    color: #f7f2ff;
    background: rgba(16, 9, 29, 0.54);
}

html[data-theme="dark"] body:has(.login-box) #status,
html[data-theme="dark"] body:has(.login-box) .login-back-link {
    color: #bda9dc;
}

html[data-theme="light"] body:has(#databaseTest) {
    color: #2e1f47;
    background: linear-gradient(135deg, #f6f0ff, #e7dcff 55%, #cdb4ff) !important;
}

html[data-theme="light"] body:has(#databaseTest) h1 {
    color: #2b1149;
}

html[data-theme="light"] body:has(#databaseTest) p,
html[data-theme="light"] body:has(#databaseTest) pre {
    color: #6b6080;
}

html[data-theme="light"] body:has(#databaseTest) pre {
    background: rgba(255, 255, 255, 0.58);
}

html[data-theme="dark"] body:has(#databaseTest) {
    color: #f7f2ff;
    background: linear-gradient(135deg, #10091d, #1b1030 52%, #261344) !important;
}

html[data-theme="dark"] body:has(#databaseTest) pre {
    background: rgba(36, 21, 59, 0.82);
}

.theme-corner {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 3000;
}

body:has(.hero) .theme-corner,
body:has(.seatmap) .theme-corner {
    top: 20px;
    right: 84px;
}

@media (max-width: 650px) {
    .theme-corner {
        top: 14px;
        right: 14px;
    }

    body:has(.hero) .theme-corner,
    body:has(.seatmap) .theme-corner {
        top: 14px;
        right: 76px;
    }
}