:root {
    color-scheme: dark;
    --bg: #080b10;
    --bg-elevated: #0d1219;
    --surface: #111821;
    --surface-raised: #161f2b;
    --surface-soft: #0c131c;
    --text: #e8edf4;
    --muted: #8d9aab;
    --border: #263242;
    --border-strong: #344358;
    --primary: #4b8dff;
    --primary-dark: #2563d9;
    --success: #22a56b;
    --danger: #d94c52;
    --warning: #d39a3c;
    --shadow: 0 24px 70px rgba(0, 0, 0, 0.38);
}

* {
    box-sizing: border-box;
}

html {
    background: var(--bg);
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--text);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    background:
        radial-gradient(circle at 12% 0%, rgba(44, 91, 157, 0.2), transparent 34rem),
        linear-gradient(145deg, #090d13 0%, #070a0f 55%, #0b1017 100%) !important;
}

a {
    color: #79aaff;
}

h1, h2, h3, strong {
    color: var(--text);
}

.container {
    width: min(100% - 32px, 1240px);
    max-width: 1240px;
    margin: 0 auto;
    padding: 32px 0 48px;
}

/* Fix site header helyfogaló a Cloud oldalakon */
body.site-body {
    padding-top: 72px;
}

body.site-body .container {
    width: min(100% - 32px, 1240px);
    max-width: 1240px;
    margin: 0 auto;
    padding: 24px 0 48px;
}

@media (max-width: 760px) {
    body.site-body {
        padding-top: 64px;
    }

    body.site-body .container {
        width: min(100% - 20px, 1240px);
        padding: 18px 0 30px;
    }
}

.topbar,
.panel,
.file-container {
    color: var(--text);
    background: linear-gradient(145deg, rgba(19, 27, 38, 0.97), rgba(12, 18, 26, 0.97)) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    box-shadow: var(--shadow) !important;
    backdrop-filter: blur(14px);
}

.topbar {
    padding: 24px;
    margin-bottom: 18px;
}

.panel,
.file-container {
    padding: 22px;
}

.header {
    margin-bottom: 0;
}

.header h1,
.title,
.topbar h1 {
    margin: 0;
    color: #f5f7fa;
    font-size: clamp(1.65rem, 3vw, 2.15rem);
    letter-spacing: -0.035em;
}

.header p,
.subtitle,
.sub,
.file-details,
.meta-note,
.small-muted,
.muted,
.share-path,
.stats,
.readonly-note {
    color: var(--muted) !important;
}

.user,
.user-pill,
.crumb,
.tag {
    color: #a9c8ff !important;
    background: rgba(63, 126, 218, 0.13) !important;
    border: 1px solid rgba(90, 151, 238, 0.3) !important;
    border-radius: 999px;
}

.toolbar,
.btn-row {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
}

.toolbar {
    margin-top: 18px;
}

.btn,
.delete-btn,
.download-btn,
.file-input-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border: 1px solid var(--border-strong) !important;
    border-radius: 8px !important;
    padding: 9px 14px;
    color: var(--text) !important;
    background: linear-gradient(180deg, #1a2431, #121a24) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.btn:hover,
.delete-btn:hover,
.download-btn:hover,
.file-input-label:hover {
    border-color: #4a607d !important;
    background: linear-gradient(180deg, #202d3d, #17212e) !important;
    box-shadow: none !important;
    transform: translateY(-1px);
}

.btn-primary,
.download-btn,
.file-input-label {
    color: #fff !important;
    border-color: #397ce0 !important;
    background: linear-gradient(135deg, var(--primary), var(--primary-dark)) !important;
}

.btn-danger,
.delete-btn {
    color: #fff !important;
    border-color: #9e3940 !important;
    background: linear-gradient(135deg, #d65359, #a92f36) !important;
}

.btn-success {
    color: #fff !important;
    border-color: #25875d !important;
    background: linear-gradient(135deg, #2bb779, #18754d) !important;
}

.btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
}

.block,
.section,
.filters,
.table-wrap,
.file-card,
.stat-card,
.share-item,
.file-preview-text,
.help-box,
.current-dir,
.share-link {
    color: var(--text);
    background: var(--surface-soft) !important;
    border-color: var(--border) !important;
    box-shadow: none !important;
}

.block,
.section,
.filters,
.table-wrap,
.share-item,
.help-box,
.current-dir,
.share-link,
.file-preview-text {
    border-radius: 10px !important;
}

#file-name {
    color: var(--muted);
    background: var(--surface-soft) !important;
    border-color: var(--border) !important;
    box-shadow: none !important;
}

.file-card {
    border-radius: 12px !important;
    overflow: hidden;
    transition: border-color 160ms ease, transform 160ms ease;
}

.file-card:hover {
    border-color: var(--border-strong) !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28) !important;
}

.file-preview {
    background: #0a1017 !important;
    border-bottom: 1px solid var(--border);
}

.file-content {
    background: var(--surface);
}

.file-name,
.file-name a,
.share-code {
    color: var(--text) !important;
}

.stat-value,
.share-code {
    color: #86b3ff !important;
}

.input,
.select,
.filters input,
.filters select,
input[type="text"],
input[type="password"],
input[type="number"],
input[type="datetime-local"],
input[type="date"],
input[type="search"] {
    color: var(--text) !important;
    background: #090f16 !important;
    border: 1px solid var(--border-strong) !important;
    border-radius: 8px !important;
    outline: none;
}

input::placeholder {
    color: #667386;
}

.input:focus,
.select:focus,
.filters input:focus,
.filters select:focus,
input:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(75, 141, 255, 0.14) !important;
}

.alert-success,
.success-message,
.message,
.success {
    color: #8fe0b7 !important;
    background: rgba(28, 126, 81, 0.15) !important;
    border-color: rgba(49, 170, 111, 0.35) !important;
}

.alert-error,
.error-message {
    color: #ffadb1 !important;
    background: rgba(151, 43, 51, 0.17) !important;
    border-color: rgba(218, 76, 84, 0.38) !important;
}

.warning,
.share-item.missing,
.share-item.legacy {
    color: #f0c77f !important;
    background: rgba(153, 104, 27, 0.13) !important;
    border-color: rgba(211, 154, 60, 0.34) !important;
}

.step {
    color: #c2d8ff !important;
    background: rgba(57, 116, 201, 0.12) !important;
    border-color: rgba(75, 141, 255, 0.28) !important;
}

.code {
    color: #a9c8ff;
    background: #090f16 !important;
    border-color: var(--border) !important;
}

.empty-state,
.empty,
.no-shares {
    color: var(--muted);
    background: rgba(9, 15, 22, 0.55) !important;
    border-color: var(--border-strong) !important;
}

table {
    color: var(--text);
}

th {
    color: #c5cfdb !important;
    background: #111923 !important;
}

td {
    border-bottom-color: #202b39 !important;
}

tbody tr:hover {
    background: rgba(70, 107, 153, 0.09);
}

.pager a {
    color: var(--text) !important;
    background: var(--surface) !important;
    border-color: var(--border) !important;
}

.pager .current {
    background: var(--primary-dark) !important;
}

.image-preview img {
    border-color: var(--border) !important;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.35) !important;
}

.back-link a,
.current-dir a {
    color: #79aaff !important;
}

.file-container div[style*="background: #f8fafc"] {
    color: var(--text);
    background: #0a1017 !important;
    border-color: var(--border) !important;
}

.file-container div[style*="border-bottom: 1px solid #e5e7eb"] {
    border-bottom-color: var(--border) !important;
}

@media (max-width: 700px) {
    .container {
        width: min(100% - 20px, 1240px);
        padding: 18px 0 30px;
    }

    .topbar,
    .panel,
    .file-container {
        padding: 16px;
        border-radius: 12px !important;
    }

    .toolbar .btn,
    .toolbar form,
    .toolbar form .btn {
        flex: 1 1 auto;
    }

    .share-item {
        grid-template-columns: 1fr !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition: none !important;
    }
}
