Merge pull request 'test' (#1) from test into master

Reviewed-on: #1

app/static/css/app.css

@@ -1,71 +1,425 @@
-body { min-height: 100vh; background: var(--bs-tertiary-bg); }
+*, *::after, *::before {
-pre { white-space: pre-wrap; }
+    box-sizing: border-box;
-html, body { overflow-x: hidden; }
+}
-.app-shell { min-height: 100vh; align-items: stretch; }
+
-.sidebar { width: 292px; min-width: 292px; max-width: 292px; flex: 0 0 292px; min-height: 100vh; position: sticky; top: 0; overflow-y: auto; overflow-x: hidden; }
+body {
-.main-column { flex: 1 1 auto; min-width: 0; width: calc(100% - 292px); }
+    min-height: 100vh;
-.main-column > .p-4, .main-column section.p-4 { width: 100%; max-width: 100%; }
+    background: var(--bs-tertiary-bg);
-.page-topbar { backdrop-filter: blur(6px); }
+}
-.page-content-wrap { background: linear-gradient(180deg, rgba(13,110,253,.03), transparent 180px); }
+
-.brand-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 14px; background: linear-gradient(135deg, #0d6efd, #6ea8fe); color: #fff; }
+pre {
-.menu-section-label { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--bs-secondary-color); margin-bottom: .5rem; margin-top: 1rem; }
+    white-space: pre-wrap;
-.nav-link { border-radius: .85rem; color: inherit; padding: .7rem .85rem; font-weight: 500; display: flex; align-items: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+}
-.nav-link i { width: 1.2rem; text-align: center; flex: 0 0 1.2rem; }
+
-.nav-link:hover { background: rgba(13,110,253,.08); }
+html, body {
-.nav-link-accent { background: rgba(13,110,253,.08); border: 1px solid rgba(13,110,253,.14); }
+    overflow-x: hidden;
-.nav-link-highlight { background: rgba(25,135,84,.08); border: 1px solid rgba(25,135,84,.14); }
+}
-.top-chip { padding: .35rem .65rem; border-radius: 999px; background: rgba(127,127,127,.08); }
+
-.readonly-pill { display: inline-flex; align-items: center; padding: .4rem .75rem; border-radius: 999px; background: rgba(255,193,7,.16); color: var(--bs-emphasis-color); border: 1px solid rgba(255,193,7,.35); font-size: .875rem; }
+.app-shell {
-.readonly-pill-compact { font-size: .8rem; padding: .35rem .6rem; }
+    min-height: 100vh;
-.page-title { font-size: 1.15rem; }
+    align-items: stretch;
-.card { border: 0; box-shadow: 0 .35rem 1rem rgba(15, 23, 42, .08); border-radius: 1rem; }
+}
-.card-header { font-weight: 600; background: color-mix(in srgb, var(--bs-body-bg) 80%, var(--bs-primary-bg-subtle)); border-bottom: 1px solid var(--bs-border-color); border-top-left-radius: 1rem !important; border-top-right-radius: 1rem !important; }
+
-.table thead th { font-size: .85rem; color: var(--bs-secondary-color); }
+.sidebar {
-.page-section-header { padding: 1.25rem; border-radius: 1.1rem; background: var(--bs-body-bg); box-shadow: 0 .35rem 1rem rgba(15, 23, 42, .08); }
+    width: 292px;
-.section-eyebrow { letter-spacing: .08em; }
+    min-width: 292px;
-.section-toolbar .btn, .page-section-header .btn { border-radius: .8rem; }
+    max-width: 292px;
-.surface-muted { background: color-mix(in srgb, var(--bs-tertiary-bg) 85%, white); border-radius: 1rem; }
+    flex: 0 0 292px;
-.settings-tab .nav-link { justify-content: flex-start; }
+    min-height: 100vh;
-.settings-tab .nav-link.active { background: var(--bs-primary); color: #fff; }
+    position: sticky;
-.stat-card { min-height: 120px; border: 0; }
+    top: 0;
-.stat-blue { background: linear-gradient(135deg, #0d6efd, #4aa3ff); }
+    overflow-y: auto;
-.stat-green { background: linear-gradient(135deg, #198754, #44c28a); }
+    overflow-x: hidden;
-.stat-purple { background: linear-gradient(135deg, #6f42c1, #9a6bff); }
+}
-.stat-orange { background: linear-gradient(135deg, #fd7e14, #ffad5c); }
+
-.stat-dark { background: linear-gradient(135deg, #343a40, #586069); }
+.main-column {
-.compact-card-body { padding: .95rem 1.1rem; }
+    flex: 1 1 auto;
-.text-wrap-balanced { max-width: 46rem; }
+    min-width: 0;
-.nfz-badge { font-size: .78rem; }
+    width: calc(100% - 292px);
-[data-bs-theme="dark"] .nav-link:hover { background: rgba(255,255,255,.08); }
+}
-[data-bs-theme="dark"] .top-chip { background: rgba(255,255,255,.06); }
+
-[data-bs-theme="dark"] .page-content-wrap { background: linear-gradient(180deg, rgba(13,110,253,.08), transparent 200px); }
+.main-column>.p-4, .main-column section.p-4 {
-@media (max-width: 991px) { .app-shell { flex-direction: column; } .sidebar { width: 100%; min-width: 100%; max-width: 100%; flex-basis: auto; min-height: auto; position: static; } .main-column { width: 100%; } }
+    width: 100%;
-.invoice-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1rem; }
+    max-width: 100%;
-.invoice-detail-main, .invoice-detail-sidebar { min-width: 0; }
+}
-.invoice-detail-sticky { position: sticky; top: 1rem; }
+
-.invoice-preview-surface { max-height: none; }
+.page-topbar {
-.invoice-preview-surface table { min-width: 720px; }
+    backdrop-filter: blur(6px);
-@media (max-width: 991px) { .invoice-detail-layout { grid-template-columns: 1fr; } .invoice-detail-sticky { position: static; } }
+}
-.source-switch { display: flex; flex-wrap: wrap; gap: .75rem; }
+
-.btn-source { border: 1px solid var(--bs-border-color); border-radius: 999px; padding: .65rem 1rem; background: var(--bs-body-bg); }
+.page-content-wrap {
-.btn-check:checked + .btn-source { background: var(--bs-primary); color: #fff; border-color: var(--bs-primary); }
+    background: linear-gradient(180deg, rgba(13, 110, 253, .03), transparent 180px);
-.source-panel { padding: 1rem; border: 1px solid var(--bs-border-color); border-radius: 1rem; background: color-mix(in srgb, var(--bs-body-bg) 92%, var(--bs-primary-bg-subtle)); }
+}
-.source-panel-note .alert { border-radius: 1rem; }
+
-.settings-module-intro { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: 1rem; padding: 1rem; border-radius: 1rem; background: color-mix(in srgb, var(--bs-tertiary-bg) 88%, var(--bs-primary-bg-subtle)); }
+.brand-icon {
-.login-page { background: linear-gradient(135deg, rgba(13,110,253,.08), rgba(111,66,193,.08)); }
+    display: inline-flex;
-.login-hero { align-items: center; justify-content: center; padding: 3rem; }
+    align-items: center;
-.login-hero-card { max-width: 34rem; }
+    justify-content: center;
-.login-form-card { max-width: 34rem; border-radius: 1.5rem; }
+    width: 42px;
-.login-feature-list { display: grid; gap: 1rem; margin-top: 2rem; font-weight: 500; }
+    height: 42px;
-.invoice-actions-cell { min-width: 170px; }
+    border-radius: 14px;
-.invoice-action-btn { min-width: 88px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: .7rem; white-space: nowrap; flex: 0 0 auto; }
+    background: linear-gradient(135deg, #0d6efd, #6ea8fe);
-.table td .invoice-action-btn i { line-height: 1; }
+    color: #fff;
-.table td.text-end { white-space: nowrap; }
+}
-.ksef-break, td.text-break { word-break: break-word; overflow-wrap: anywhere; }
+
-.invoice-ksef-col { min-width: 190px; max-width: 260px; }
+.menu-section-label {
-.invoice-number-col { min-width: 180px; }
+    font-size: .75rem;
-.invoice-actions-stack { display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: .5rem; }
+    text-transform: uppercase;
-.pagination { gap: .2rem; }
+    letter-spacing: .08em;
-.pagination .page-link { border-radius: .65rem; }
+    color: var(--bs-secondary-color);
-@media (max-width: 1400px) { .invoice-actions-cell { min-width: 150px; } .invoice-action-btn { min-width: 80px; padding-left: .6rem; padding-right: .6rem; } .invoice-ksef-col { min-width: 170px; max-width: 220px; } }
+    margin-bottom: .5rem;
-@media (max-width: 1200px) { .invoice-actions-stack { flex-wrap: wrap; } .table td.text-end { white-space: normal; } }
+    margin-top: 1rem;
+}
+
+.nav-link {
+    border-radius: .85rem;
+    color: inherit;
+    padding: .7rem .85rem;
+    font-weight: 500;
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.nav-link i {
+    width: 1.2rem;
+    text-align: center;
+    flex: 0 0 1.2rem;
+}
+
+.nav-link:hover {
+    background: rgba(13, 110, 253, .08);
+}
+
+.nav-link-accent {
+    background: rgba(13, 110, 253, .08);
+    border: 1px solid rgba(13, 110, 253, .14);
+}
+
+.nav-link-highlight {
+    background: rgba(25, 135, 84, .08);
+    border: 1px solid rgba(25, 135, 84, .14);
+}
+
+.top-chip {
+    padding: .35rem .65rem;
+    border-radius: 999px;
+    background: rgba(127, 127, 127, .08);
+}
+
+.readonly-pill {
+    display: inline-flex;
+    align-items: center;
+    padding: .4rem .75rem;
+    border-radius: 999px;
+    background: rgba(255, 193, 7, .16);
+    color: var(--bs-emphasis-color);
+    border: 1px solid rgba(255, 193, 7, .35);
+    font-size: .875rem;
+}
+
+.readonly-pill-compact {
+    font-size: .8rem;
+    padding: .35rem .6rem;
+}
+
+.page-title {
+    font-size: 1.15rem;
+}
+
+.card {
+    border: 0;
+    box-shadow: 0 .35rem 1rem rgba(15, 23, 42, .08);
+    border-radius: 1rem;
+}
+
+.card-header {
+    font-weight: 600;
+    background: color-mix(in srgb, var(--bs-body-bg) 80%, var(--bs-primary-bg-subtle));
+    border-bottom: 1px solid var(--bs-border-color);
+    border-top-left-radius: 1rem !important;
+    border-top-right-radius: 1rem !important;
+}
+
+.table thead th {
+    font-size: .85rem;
+    color: var(--bs-secondary-color);
+}
+
+.page-section-header {
+    padding: 1.25rem;
+    border-radius: 1.1rem;
+    background: var(--bs-body-bg);
+    box-shadow: 0 .35rem 1rem rgba(15, 23, 42, .08);
+}
+
+.section-eyebrow {
+    letter-spacing: .08em;
+}
+
+.section-toolbar .btn, .page-section-header .btn {
+    border-radius: .8rem;
+}
+
+.surface-muted {
+    background: color-mix(in srgb, var(--bs-tertiary-bg) 85%, white);
+    border-radius: 1rem;
+}
+
+.settings-tab .nav-link {
+    justify-content: flex-start;
+}
+
+.settings-tab .nav-link.active {
+    background: var(--bs-primary);
+    color: #fff;
+}
+
+.stat-card {
+    min-height: 120px;
+    border: 0;
+}
+
+.stat-blue {
+    background: linear-gradient(135deg, #0d6efd, #4aa3ff);
+}
+
+.stat-green {
+    background: linear-gradient(135deg, #198754, #44c28a);
+}
+
+.stat-purple {
+    background: linear-gradient(135deg, #6f42c1, #9a6bff);
+}
+
+.stat-orange {
+    background: linear-gradient(135deg, #fd7e14, #ffad5c);
+}
+
+.stat-dark {
+    background: linear-gradient(135deg, #343a40, #586069);
+}
+
+.compact-card-body {
+    padding: .95rem 1.1rem;
+}
+
+.text-wrap-balanced {
+    max-width: 46rem;
+}
+
+.nfz-badge {
+    font-size: .78rem;
+}
+
+[data-bs-theme="dark"] .nav-link:hover {
+    background: rgba(255, 255, 255, .08);
+}
+
+[data-bs-theme="dark"] .top-chip {
+    background: rgba(255, 255, 255, .06);
+}
+
+[data-bs-theme="dark"] .page-content-wrap {
+    background: linear-gradient(180deg, rgba(13, 110, 253, .08), transparent 200px);
+}
+
+@media (max-width: 991px) {
+    .app-shell {
+        flex-direction: column;
+    }
+
+    .sidebar {
+        width: 100%;
+        min-width: 100%;
+        max-width: 100%;
+        flex-basis: auto;
+        min-height: auto;
+        position: static;
+    }
+
+    .main-column {
+        width: 100%;
+    }
+}
+
+.invoice-detail-layout {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) 320px;
+    gap: 1rem;
+}
+
+.invoice-detail-main, .invoice-detail-sidebar {
+    min-width: 0;
+}
+
+.invoice-detail-sticky {
+    position: sticky;
+    top: 1rem;
+}
+
+.invoice-preview-surface {
+    max-height: none;
+}
+
+.invoice-preview-surface table {
+    min-width: 720px;
+}
+
+@media (max-width: 991px) {
+    .invoice-detail-layout {
+        grid-template-columns: 1fr;
+    }
+
+    .invoice-detail-sticky {
+        position: static;
+    }
+}
+
+.source-switch {
+    display: flex;
+    flex-wrap: wrap;
+    gap: .75rem;
+}
+
+.btn-source {
+    border: 1px solid var(--bs-border-color);
+    border-radius: 999px;
+    padding: .65rem 1rem;
+    background: var(--bs-body-bg);
+}
+
+.btn-check:checked+.btn-source {
+    background: var(--bs-primary);
+    color: #fff;
+    border-color: var(--bs-primary);
+}
+
+.source-panel {
+    padding: 1rem;
+    border: 1px solid var(--bs-border-color);
+    border-radius: 1rem;
+    background: color-mix(in srgb, var(--bs-body-bg) 92%, var(--bs-primary-bg-subtle));
+}
+
+.source-panel-note .alert {
+    border-radius: 1rem;
+}
+
+.settings-module-intro {
+    display: flex;
+    justify-content: space-between;
+    gap: 1rem;
+    align-items: flex-start;
+    margin-bottom: 1rem;
+    padding: 1rem;
+    border-radius: 1rem;
+    background: color-mix(in srgb, var(--bs-tertiary-bg) 88%, var(--bs-primary-bg-subtle));
+}
+
+.login-page {
+    background: linear-gradient(135deg, rgba(13, 110, 253, .08), rgba(111, 66, 193, .08));
+}
+
+.login-hero {
+    align-items: center;
+    justify-content: center;
+    padding: 3rem;
+}
+
+.login-hero-card {
+    max-width: 34rem;
+}
+
+.login-form-card {
+    max-width: 34rem;
+    border-radius: 1.5rem;
+}
+
+.login-feature-list {
+    display: grid;
+    gap: 1rem;
+    margin-top: 2rem;
+    font-weight: 500;
+}
+
+.invoice-actions-cell {
+    min-width: 170px;
+}
+
+.invoice-action-btn {
+    min-width: 88px;
+    height: 34px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: .7rem;
+    white-space: nowrap;
+    flex: 0 0 auto;
+}
+
+.table td .invoice-action-btn i {
+    line-height: 1;
+}
+
+.table td.text-end {
+    white-space: nowrap;
+}
+
+.ksef-break, td.text-break {
+    word-break: break-word;
+    overflow-wrap: anywhere;
+}
+
+.invoice-ksef-col {
+    min-width: 190px;
+    max-width: 260px;
+}
+
+.invoice-number-col {
+    min-width: 180px;
+}
+
+.invoice-actions-stack {
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: flex-end;
+    gap: .5rem;
+}
+
+.pagination {
+    gap: .2rem;
+}
+
+.pagination .page-link {
+    border-radius: .65rem;
+}
+
+@media (max-width: 1400px) {
+    .invoice-actions-cell {
+        min-width: 150px;
+    }
+
+    .invoice-action-btn {
+        min-width: 80px;
+        padding-left: .6rem;
+        padding-right: .6rem;
+    }
+
+    .invoice-ksef-col {
+        min-width: 170px;
+        max-width: 220px;
+    }
+}
+
+@media (max-width: 1200px) {
+    .invoice-actions-stack {
+        flex-wrap: wrap;
+    }
+
+    .table td.text-end {
+        white-space: normal;
+    }
+}