*{box-sizing:border-box}body{margin:0;background:#f3f1ee;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#161616}.wrap{max-width:980px;margin:70px auto;padding:0 22px}.wrap.wide{max-width:1280px}.card{background:#fff;border-radius:18px;padding:32px;box-shadow:0 12px 40px rgba(0,0,0,.07)}h1{margin-top:0;font-size:34px}h2{margin-top:34px;font-size:22px}.muted{color:#666}.error{background:#ffe4e6;color:#9f1239;padding:12px 14px;border-radius:10px;margin:16px 0}.success{background:#dcfce7;color:#166534;padding:12px 14px;border-radius:10px;margin:16px 0}label{display:block;margin:14px 0 6px;font-weight:600}input,textarea,select{width:100%;border:1px solid #d6d6d6;border-radius:10px;padding:12px;font:inherit;background:#fff}textarea{resize:vertical}button,.btn{display:inline-block;background:#181818;color:#fff;border:0;border-radius:999px;padding:12px 20px;font-weight:700;text-decoration:none;cursor:pointer}.btn.secondary{background:#e5e7eb;color:#111}.actions{display:flex;gap:12px;align-items:center;margin-top:24px;flex-wrap:wrap}.grid{display:grid;gap:16px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.topbar{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.06)}.topbar a{color:#111}.align-end{display:flex;align-items:flex-end}hr{border:0;border-top:1px solid #e5e7eb;margin:32px 0}.home{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;max-width:1280px;margin:0 auto;padding:42px 28px}.brand{display:inline-block;background:#181818;color:#fff;padding:9px 14px;border-radius:999px;font-weight:800;margin-bottom:24px}.home-left h1{font-size:56px;line-height:1.04;margin:0 0 16px}.lead{font-size:22px;color:#333;line-height:1.4}.home-text{font-size:17px;color:#555;line-height:1.7;max-width:680px}.home-image{margin-top:24px;max-width:100%;border-radius:24px;box-shadow:0 12px 36px rgba(0,0,0,.1)}.info-box{margin:18px 0;background:#f8fafc;border:1px solid #e5e7eb;border-radius:14px;padding:16px}.info-box p{margin-bottom:0;color:#555;line-height:1.6}.login-card{max-width:520px;margin-left:auto}.small-link{margin-top:18px;font-size:13px}.small-link a{color:#666}.qr-list{display:flex;flex-direction:column;gap:14px;margin-top:24px}.qr-item{display:flex;justify-content:space-between;gap:18px;align-items:center;border:1px solid #e5e7eb;border-radius:14px;padding:18px;background:#fafafa}.qr-actions{display:flex;gap:10px;flex-wrap:wrap}.package-banner{display:flex;flex-direction:column;gap:4px;background:#f4f4f5;border:1px solid #e4e4e7;border-radius:14px;padding:14px 16px;margin-bottom:20px}.branding{display:flex;justify-content:center;align-items:center;gap:8px}.branding img{height:24px;width:auto;border-radius:4px}.qr-download-box{display:flex;justify-content:space-between;gap:24px;align-items:center;background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;padding:18px;margin:20px 0}.qr-download-image img,.qr-preview img{width:150px;height:150px;border-radius:10px;background:#fff;padding:8px;border:1px solid #e5e7eb}.qr-item-with-image{align-items:center}.qr-preview{display:flex;flex-direction:column;gap:10px;align-items:center}.qr-info{flex:1}.small-btn{font-size:12px;padding:8px 12px}@media(max-width:900px){.home{grid-template-columns:1fr;padding:28px 18px}.home-left h1{font-size:38px}.login-card{max-width:none;margin-left:0}}@media(max-width:760px){.grid.two,.grid.three{grid-template-columns:1fr}.wrap{margin:28px auto}.card{padding:22px}h1{font-size:28px}.qr-item{flex-direction:column;align-items:flex-start}.qr-actions{width:100%}.qr-download-box{flex-direction:column;align-items:flex-start}.qr-item-with-image{align-items:flex-start}.qr-preview{align-items:flex-start}}
.upgrade-box{margin:16px 0;background:#f8fafc;border:1px solid #e5e7eb;border-radius:14px;padding:14px}
.upgrade-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.small{font-size:13px}
.file-list{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.file-item{display:flex;justify-content:space-between;gap:16px;align-items:center;border:1px solid #e5e7eb;border-radius:14px;background:#fafafa;padding:14px}
.btn.danger,button.danger{background:#dc2626;color:#fff}
@media(max-width:760px){.file-item{flex-direction:column;align-items:flex-start}.file-item form{width:100%}.file-item button{width:100%}}
.next-package-box{margin:16px 0;background:#fff7ed;border:1px solid #fed7aa;border-radius:14px;padding:14px}
.next-package-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
.next-package-form select{max-width:360px}
@media(max-width:760px){.next-package-form{flex-direction:column;align-items:stretch}.next-package-form select{max-width:none}}
.tariff-box{margin:18px 0;background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;padding:16px}
.tariff-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;align-items:center}
.tariff-form{margin-bottom:0}
.small{font-size:13px}
@media(max-width:760px){.tariff-actions{flex-direction:column;align-items:stretch}.tariff-actions .btn,.tariff-actions button{width:100%}}

.plan-card{
    margin:18px 0 24px;
    background:linear-gradient(180deg,#ffffff,#f8fafc);
    border:1px solid #e5e7eb;
    border-radius:18px;
    padding:20px;
    box-shadow:0 10px 30px rgba(15,23,42,.06);
}
.plan-head{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
}
.plan-head strong{
    display:block;
    font-size:24px;
    line-height:1.1;
}
.plan-kicker{
    display:block;
    color:#64748b;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    margin-bottom:4px;
}
.plan-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:64px;
    padding:8px 12px;
    border-radius:999px;
    background:#111827;
    color:#fff;
    font-weight:800;
    font-size:13px;
}
.plan-pro .plan-badge{background:#0ea5e9}
.plan-managed .plan-badge{background:#16a34a}
.plan-meta{
    margin:14px 0;
    color:#475569;
}
.plan-features{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px 18px;
    margin:14px 0;
    padding:0;
    list-style:none;
}
.plan-features li{
    position:relative;
    padding-left:22px;
    color:#334155;
}
.plan-features li:before{
    content:"✓";
    position:absolute;
    left:0;
    top:0;
    font-weight:900;
}
.plan-next{
    margin:14px 0;
    padding:12px 14px;
    border-radius:12px;
    background:#fff7ed;
    border:1px solid #fed7aa;
    color:#9a3412;
    font-weight:700;
}
.plan-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
    margin-top:16px;
}
.plan-form{margin:0}
.plan-primary{
    background:#111827;
    color:#fff;
}
@media(max-width:760px){
    .plan-head{flex-direction:column}
    .plan-features{grid-template-columns:1fr}
    .plan-actions{flex-direction:column;align-items:stretch}
    .plan-actions .btn,.plan-actions button{width:100%}
}


.legal-footer{
    max-width:1280px;
    margin:28px auto 18px;
    padding:0 22px;
    text-align:center;
    color:#777;
    font-size:13px;
}
.legal-footer a{
    color:#555;
    text-decoration:none;
}
.legal-footer a:hover{
    text-decoration:underline;
}
.legal-footer span{
    margin:0 8px;
    color:#aaa;
}

.file-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.file-actions form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0}
.info-box{margin:18px 0;background:#f8fafc;border:1px solid #e5e7eb;border-radius:14px;padding:16px}
@media(max-width:760px){
    .file-actions{flex-direction:column;align-items:stretch}
    .file-actions form{flex-direction:column;align-items:stretch}
}

/* =========================================================
   Rich Text Editor - Wiegandts QR-Portal
   ========================================================= */

.editor-wrap{
    margin:10px 0 22px;
}

.rich-toolbar{
    display:flex !important;
    gap:8px !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    width:100% !important;
    margin:10px 0 0 !important;
    padding:10px !important;
    border:1px solid #dbe3ef !important;
    border-bottom:0 !important;
    border-radius:16px 16px 0 0 !important;
    background:linear-gradient(180deg,#ffffff,#f8fafc) !important;
    box-shadow:0 8px 20px rgba(15,23,42,.04) !important;
}

.rich-toolbar button,
.rich-toolbar .color-tool{
    width:auto !important;
    min-width:auto !important;
    min-height:40px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;
    padding:9px 13px !important;
    border:1px solid #d1d5db !important;
    border-radius:999px !important;
    background:#ffffff !important;
    color:#111827 !important;
    font-weight:800 !important;
    font-size:13px !important;
    line-height:1 !important;
    cursor:pointer !important;
    transition:all .15s ease !important;
    box-shadow:0 1px 2px rgba(15,23,42,.04) !important;
}

.rich-toolbar button:hover,
.rich-toolbar .color-tool:hover{
    transform:translateY(-1px) !important;
    border-color:#111827 !important;
    box-shadow:0 8px 18px rgba(15,23,42,.10) !important;
}

.rich-toolbar button.active{
    background:#111827 !important;
    color:#ffffff !important;
    border-color:#111827 !important;
}

.rich-toolbar button > strong,
.rich-toolbar button > em,
.rich-toolbar button > u{
    font-size:15px !important;
}

.rich-toolbar .color-tool{
    position:relative !important;
    overflow:hidden !important;
}

.rich-toolbar .color-tool input[type="color"]{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    opacity:0 !important;
    cursor:pointer !important;
    padding:0 !important;
    border:0 !important;
}

.rich-editor{
    display:block !important;
    width:100% !important;
    min-height:230px !important;
    padding:20px !important;
    border:2px solid #dbe3ef !important;
    border-radius:0 0 16px 16px !important;
    background:#ffffff !important;
    line-height:1.7 !important;
    font-size:15px !important;
    color:#222222 !important;
    outline:none !important;
    overflow:auto !important;
    box-shadow:0 10px 24px rgba(15,23,42,.04) !important;
}

.rich-editor:focus{
    border-color:#6dc1c9 !important;
    box-shadow:0 0 0 4px rgba(109,193,201,.22), 0 10px 24px rgba(15,23,42,.06) !important;
}

.rich-editor:empty:before{
    content:attr(data-placeholder) !important;
    display:block !important;
    color:#94a3b8 !important;
    pointer-events:none !important;
}

.rich-editor p{
    margin:0 0 12px !important;
}

.rich-editor ul,
.rich-editor ol{
    margin:12px 0 !important;
    padding-left:26px !important;
}

.rich-editor li{
    margin:6px 0 !important;
}

.rich-editor a{
    color:#0f766e !important;
    font-weight:800 !important;
    text-decoration:underline !important;
}

.rich-editor b,
.rich-editor strong{
    font-weight:800 !important;
}

.rich-editor u{
    text-decoration-thickness:2px !important;
    text-underline-offset:3px !important;
}

@media(max-width:760px){
    .rich-toolbar{
        gap:6px !important;
        padding:8px !important;
    }

    .rich-toolbar button,
    .rich-toolbar .color-tool{
        flex:1 1 calc(50% - 6px) !important;
        min-width:0 !important;
        padding:10px 9px !important;
    }

    .rich-editor{
        min-height:190px !important;
        padding:16px !important;
    }
}

