/* ============================================
   CheckApp — Neo-Brutalism Theme
   All overrides scoped to [data-theme="brutalism"]
   ============================================ */

/* --- Variable Overrides --- */
[data-theme="brutalism"] {
    /* Borders */
    --color-border:         #555555;
    --color-border-hover:   #888888;

    /* Semantic — brighter */
    --color-danger:         #ff3333;
    --color-danger-border:  #ff3333;
    --color-info:           #4d9fff;
    --color-info-border:    #4d9fff;
    --color-warning:        #ffcc00;
    --color-purple:         #a855f7;
    --color-success-border: #22c55e;
    --color-success-text:   #22c55e;
    --color-danger-text:    #ff3333;
    --color-info-text:      #4d9fff;

    /* Typography — Manrope */
    --font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* Radii — more square */
    --radius-sm: 2px;
    --radius-md: 4px;
    --radius-lg: 6px;
    --radius-xl: 8px;

    /* Shadows — hard offset */
    --shadow-sm: 2px 2px 0px #22c55e;
    --shadow-md: 4px 4px 0px #22c55e;
    --shadow-lg: 6px 6px 0px #22c55e;

    /* Transitions — faster */
    --transition-fast: 100ms ease;
    --transition-normal: 180ms ease;
    --transition-slow: 250ms ease;

    /* NEW variables */
    --border-width: 2px;
    --border-width-thick: 3px;
}

/* --- Header --- */
[data-theme="brutalism"] .header {
    background: #111111;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: 3px solid var(--color-border);
    box-shadow: 0 3px 0px var(--color-accent);
}

[data-theme="brutalism"] .header h1 {
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

[data-theme="brutalism"] .logo-check {
    text-shadow: 2px 2px 0px rgba(34, 197, 94, 0.4);
}

[data-theme="brutalism"] .logo-app {
    opacity: 1;
    text-shadow: 2px 2px 0px rgba(255, 255, 255, 0.15);
}

/* --- Buttons: .btn base --- */
[data-theme="brutalism"] .btn {
    border: 2px solid var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
}

[data-theme="brutalism"] .btn--accent {
    box-shadow: 4px 4px 0px var(--color-accent);
    color: #000;
}

[data-theme="brutalism"] .btn--accent:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-accent);
}

[data-theme="brutalism"] .btn--accent:active:not(:disabled) {
    transform: translate(4px, 4px);
    box-shadow: none;
}

[data-theme="brutalism"] .btn--danger {
    box-shadow: 4px 4px 0px var(--color-danger);
}

[data-theme="brutalism"] .btn--danger:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-danger);
}

[data-theme="brutalism"] .btn--danger:active:not(:disabled) {
    transform: translate(4px, 4px);
    box-shadow: none;
}

[data-theme="brutalism"] .btn--info {
    box-shadow: 4px 4px 0px var(--color-info);
}

[data-theme="brutalism"] .btn--info:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-info);
}

[data-theme="brutalism"] .btn--info:active:not(:disabled) {
    transform: translate(4px, 4px);
    box-shadow: none;
}

[data-theme="brutalism"] .btn--purple {
    box-shadow: 4px 4px 0px var(--color-purple);
}

[data-theme="brutalism"] .btn--purple:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-purple);
}

[data-theme="brutalism"] .btn--purple:active:not(:disabled) {
    transform: translate(4px, 4px);
    box-shadow: none;
}

[data-theme="brutalism"] .btn--secondary {
    box-shadow: 4px 4px 0px #6c757d;
}

[data-theme="brutalism"] .btn--secondary:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px #6c757d;
}

[data-theme="brutalism"] .btn--secondary:active:not(:disabled) {
    transform: translate(4px, 4px);
    box-shadow: none;
}

[data-theme="brutalism"] .btn--warning {
    box-shadow: 4px 4px 0px var(--color-warning);
}

[data-theme="brutalism"] .btn--warning:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-warning);
}

[data-theme="brutalism"] .btn--warning:active:not(:disabled) {
    transform: translate(4px, 4px);
    box-shadow: none;
}

/* --- Legacy buttons --- */
[data-theme="brutalism"] .btn-primary {
    border: 2px solid var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
    box-shadow: 4px 4px 0px var(--color-accent);
}

[data-theme="brutalism"] .btn-primary:hover {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-accent);
}

[data-theme="brutalism"] .btn-search {
    border: 2px solid var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
    box-shadow: 4px 4px 0px var(--color-accent);
}

[data-theme="brutalism"] .btn-search:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-accent);
}

[data-theme="brutalism"] .btn-logout {
    border: 2px solid var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
    box-shadow: 3px 3px 0px var(--color-danger);
}

[data-theme="brutalism"] .btn-logout:hover {
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0px var(--color-danger);
}

[data-theme="brutalism"] .btn-export {
    border: 2px solid var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
    box-shadow: 3px 3px 0px #6c757d;
}

[data-theme="brutalism"] .btn-export:hover:not(:disabled) {
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0px #6c757d;
}

[data-theme="brutalism"] .btn-back {
    border: 2px solid var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
    box-shadow: 3px 3px 0px #6c757d;
}

[data-theme="brutalism"] .btn-back:hover {
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0px #6c757d;
}

[data-theme="brutalism"] .btn-small {
    border: 2px solid var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
}

[data-theme="brutalism"] .btn-small.btn-info {
    box-shadow: 2px 2px 0px var(--color-info);
}

[data-theme="brutalism"] .btn-small.btn-danger {
    box-shadow: 2px 2px 0px var(--color-danger);
}

[data-theme="brutalism"] .btn-small.btn-warning {
    box-shadow: 2px 2px 0px var(--color-warning);
}

[data-theme="brutalism"] .btn-small:hover {
    transform: translate(2px, 2px);
    box-shadow: none;
}

/* --- Form Inputs --- */
[data-theme="brutalism"] .form-group input,
[data-theme="brutalism"] .form-group select {
    border: 2px solid var(--color-border);
}

[data-theme="brutalism"] .form-group input:focus,
[data-theme="brutalism"] .form-group select:focus {
    border-color: var(--color-accent);
    box-shadow: 3px 3px 0px var(--color-accent);
}

/* --- Cards / Sections --- */
[data-theme="brutalism"] .search-section {
    border: 2px solid var(--color-border);
    box-shadow: 5px 5px 0px var(--color-accent);
}

[data-theme="brutalism"] .results-section {
    border: 2px solid var(--color-border);
    box-shadow: 5px 5px 0px var(--color-accent);
}

[data-theme="brutalism"] .stat-card {
    border: 2px solid var(--color-border);
    box-shadow: 4px 4px 0px var(--color-border);
}

[data-theme="brutalism"] .stat-card:hover {
    border-color: var(--color-accent);
    box-shadow: 4px 4px 0px var(--color-accent);
    transform: none;
}

/* --- Login container --- */
[data-theme="brutalism"] .login-container {
    border: 3px solid var(--color-accent);
    box-shadow: 6px 6px 0px var(--color-accent);
}

[data-theme="brutalism"] .login-container::before {
    display: none;
}

/* --- Source tabs --- */
[data-theme="brutalism"] .source-tab {
    border: 3px solid var(--color-border);
    font-weight: 700;
    text-transform: uppercase;
    box-shadow: 4px 4px 0px var(--color-border);
}

[data-theme="brutalism"] .source-tab:hover {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px var(--color-border);
}

[data-theme="brutalism"] .source-tab.active {
    border-color: var(--color-accent);
    box-shadow: 4px 4px 0px var(--color-accent);
}

/* --- Query tabs --- */
[data-theme="brutalism"] .query-tab {
    border: 2px solid var(--color-border);
    box-shadow: 3px 3px 0px var(--color-border);
}

[data-theme="brutalism"] .query-tab:hover {
    transform: translate(1px, 1px);
    box-shadow: 2px 2px 0px var(--color-border);
}

[data-theme="brutalism"] .query-tab.active {
    border-color: var(--color-accent);
    box-shadow: 3px 3px 0px var(--color-accent);
}

/* --- Result items --- */
[data-theme="brutalism"] .result-item {
    border: 2px solid var(--color-border);
    box-shadow: 3px 3px 0px var(--color-border);
}

[data-theme="brutalism"] .result-item:hover {
    border-color: var(--color-accent);
    box-shadow: 4px 4px 0px var(--color-accent);
}

[data-theme="brutalism"] .result-header {
    border-bottom: 2px solid var(--color-border);
}

/* --- Modals --- */
[data-theme="brutalism"] .modal-content {
    border: 3px solid var(--color-border);
    box-shadow: 8px 8px 0px var(--color-accent);
    transform: none;
}

[data-theme="brutalism"] .modal.show .modal-content {
    transform: none;
}

/* --- Messages --- */
[data-theme="brutalism"] .message {
    border-width: 2px;
}

[data-theme="brutalism"] .message.error {
    box-shadow: 3px 3px 0px var(--color-danger);
}

[data-theme="brutalism"] .message.success {
    box-shadow: 3px 3px 0px var(--color-accent);
}

[data-theme="brutalism"] .message.info {
    box-shadow: 3px 3px 0px var(--color-info);
}

/* --- Tables (admin) --- */
[data-theme="brutalism"] thead {
    border-bottom: 3px solid var(--color-border);
}

[data-theme="brutalism"] th {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

[data-theme="brutalism"] .users-table {
    border: 2px solid var(--color-border);
}

/* --- Badges --- */
[data-theme="brutalism"] .badge {
    border: 2px solid;
    font-weight: 700;
    text-transform: uppercase;
}

[data-theme="brutalism"] .badge-admin {
    background: var(--color-warning);
    color: #000;
    box-shadow: 2px 2px 0px #000;
}

[data-theme="brutalism"] .badge-user {
    background: var(--color-info);
    color: #fff;
    box-shadow: 2px 2px 0px #000;
}

/* --- Admin tabs --- */
[data-theme="brutalism"] .tab {
    border: 2px solid var(--color-border);
    font-weight: 700;
    text-transform: uppercase;
    box-shadow: 3px 3px 0px var(--color-border);
}

[data-theme="brutalism"] .tab:hover {
    transform: translate(1px, 1px);
    box-shadow: 2px 2px 0px var(--color-border);
}

[data-theme="brutalism"] .tab.active {
    border-color: var(--color-accent);
    box-shadow: 3px 3px 0px var(--color-accent);
}

/* --- Help boxes --- */
[data-theme="brutalism"] .help-box {
    border: 2px solid var(--color-border);
}

/* --- Admin link --- */
[data-theme="brutalism"] .admin-link {
    border: 2px solid var(--color-border);
    box-shadow: 3px 3px 0px var(--color-border);
    text-transform: uppercase;
    font-weight: 700;
    backdrop-filter: none;
}

[data-theme="brutalism"] .admin-link:hover {
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0px var(--color-border);
}

/* --- Validation styles --- */
[data-theme="brutalism"] input.valid {
    box-shadow: 3px 3px 0px var(--color-accent);
}

[data-theme="brutalism"] input.invalid {
    box-shadow: 3px 3px 0px var(--color-danger);
}

/* --- Focus-visible: hard-shadow style --- */
[data-theme="brutalism"] *:focus-visible {
    outline: 3px solid var(--color-accent);
    outline-offset: 0;
    box-shadow: 3px 3px 0px var(--color-accent);
}

/* --- Animations: simpler --- */
[data-theme="brutalism"] .message,
[data-theme="brutalism"] .result-item,
[data-theme="brutalism"] .tab-content.active {
    animation: brutalFadeIn 0.2s ease;
}

@keyframes brutalFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* --- Theme toggle styling --- */
[data-theme="brutalism"] .theme-toggle-select {
    border: 2px solid var(--color-border) !important;
    box-shadow: 2px 2px 0px var(--color-accent);
    font-weight: 700;
    text-transform: uppercase;
}

.theme-toggle-wrapper {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.theme-toggle-label {
    color: var(--color-text-secondary);
    font-size: 0.85rem;
    font-weight: 500;
    white-space: nowrap;
}

.theme-toggle-select {
    background: var(--color-bg-surface);
    color: var(--color-text-primary);
    border: 1px solid var(--color-border-hover);
    border-radius: var(--radius-md);
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all var(--transition-normal);
}

.theme-toggle-select:focus {
    outline: none;
    border-color: var(--color-accent);
}

/* --- Responsive: tablets (768px) --- */
@media (max-width: 768px) {
    .theme-toggle-wrapper {
        order: -1;
    }
}

/* --- Responsive: smartphones (480px) --- */
@media (max-width: 480px) {
    [data-theme="brutalism"] {
        --shadow-sm: 1px 1px 0px #22c55e;
        --shadow-md: 2px 2px 0px #22c55e;
        --shadow-lg: 3px 3px 0px #22c55e;
    }

    [data-theme="brutalism"] .btn-small.btn-info {
        box-shadow: 1px 1px 0px var(--color-info);
    }

    [data-theme="brutalism"] .btn-small.btn-danger {
        box-shadow: 1px 1px 0px var(--color-danger);
    }

    [data-theme="brutalism"] .btn-small.btn-warning {
        box-shadow: 1px 1px 0px var(--color-warning);
    }

    [data-theme="brutalism"] .modal-content {
        box-shadow: 4px 4px 0px var(--color-accent);
    }

    [data-theme="brutalism"] .search-section,
    [data-theme="brutalism"] .results-section {
        box-shadow: 3px 3px 0px var(--color-accent);
    }

    [data-theme="brutalism"] .stat-card {
        box-shadow: 2px 2px 0px var(--color-border);
    }

    [data-theme="brutalism"] .login-container {
        box-shadow: 4px 4px 0px var(--color-accent);
    }

    [data-theme="brutalism"] .source-tab {
        box-shadow: 2px 2px 0px var(--color-border);
    }

    [data-theme="brutalism"] .source-tab.active {
        box-shadow: 2px 2px 0px var(--color-accent);
    }

    [data-theme="brutalism"] .tab {
        box-shadow: 2px 2px 0px var(--color-border);
    }

    [data-theme="brutalism"] .tab.active {
        box-shadow: 2px 2px 0px var(--color-accent);
    }

    [data-theme="brutalism"] .admin-link {
        box-shadow: 2px 2px 0px var(--color-border);
    }
}
