/*
 * Qisutu - Open Source Ticket System
 * Copyright (C) 2026 Franziska Steps
 * Qisutu - Kim-KI, https://qisutu.de
 *
 * This file is part of Qisutu.
 *
 * Qisutu is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * Qisutu is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with Qisutu. If not, see <https://www.gnu.org/licenses/>.
 *
 * SPDX-FileCopyrightText: 2026 Franziska Steps
 * SPDX-License-Identifier: AGPL-3.0-or-later
 */

:root {
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #1f2933;
    background: #f4f7f9;
}

* { box-sizing: border-box; }

body { margin: 0; background: #f4f7f9; color: #1f2933; }

.qisutu-public-form-shell { max-width: 820px; margin: 0 auto; padding: 32px 18px; }
.qisutu-public-form-card { background: #fff; border: 1px solid #d5e0e6; border-radius: 12px; box-shadow: 0 12px 34px rgba(25, 58, 72, .09); padding: 30px; }
.qisutu-public-form-languages { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; margin: 0 0 18px; }
.qisutu-public-form-languages a { border: 1px solid #bdcbd3; border-radius: 6px; color: #40576a; font-size: 12px; font-weight: 800; padding: 5px 8px; text-decoration: none; }
.qisutu-public-form-languages a:hover { border-color: #00728c; color: #00586d; }
.qisutu-public-form-languages .qisutu-public-form-language-active { border-color: #006078; background: #006078; color: #fff; }
.qisutu-public-form-header { margin-bottom: 24px; }
.qisutu-public-form-brand { display: inline-block; margin-bottom: 12px; color: #006078; font-size: 14px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.qisutu-public-form-header h1, .qisutu-public-form-state h1 { margin: 0 0 10px; color: #172230; font-size: clamp(24px, 4vw, 34px); }
.qisutu-public-form-header p, .qisutu-public-form-state p { margin: 0; color: #5d6d7e; line-height: 1.55; }
.qisutu-ticket-form-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.qisutu-form-field { min-width: 0; }
.qisutu-ticket-form-field-wide { grid-column: 1 / -1; }
.qisutu-form-field > label:not(.qisutu-form-checkbox) { display: block; margin-bottom: 7px; font-weight: 700; }
.qisutu-form-field input:not([type="checkbox"]), .qisutu-form-field select, .qisutu-form-field textarea { width: 100%; padding: 11px 12px; border: 1px solid #bdcbd3; border-radius: 7px; background: #fff; color: #1f2933; font: inherit; }
.qisutu-form-field textarea { min-height: 116px; resize: vertical; }
.qisutu-form-field input:focus, .qisutu-form-field select:focus, .qisutu-form-field textarea:focus { border-color: #00728c; outline: 3px solid rgba(0, 114, 140, .15); }
.qisutu-form-checkbox { display: flex; gap: 9px; align-items: flex-start; line-height: 1.45; }
.qisutu-form-checkbox input { width: 18px; height: 18px; margin-top: 2px; accent-color: #006078; }
.qisutu-form-hint { display: block; margin-top: 6px; color: #687a8c; font-size: 13px; line-height: 1.4; }
.qisutu-form-error { margin-bottom: 18px; border: 1px solid #e8a5a5; border-radius: 7px; background: #fff3f3; color: #a51d1d; padding: 11px 13px; }
.qisutu-hidden { display: none !important; }
.qisutu-public-form-actions { margin-top: 24px; }
.qisutu-public-form-actions button { border: 1px solid #00586d; border-radius: 7px; background: #006078; color: #fff; cursor: pointer; font: inherit; font-weight: 800; padding: 12px 20px; transition: background .16s ease, transform .16s ease; }
.qisutu-public-form-actions button:hover { background: #004b5d; transform: translateY(-1px); }
.qisutu-public-form-privacy { margin: 18px 0 0; color: #768493; font-size: 12px; }
.qisutu-public-form-honeypot { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.qisutu-public-form-state { padding: 24px 4px; text-align: center; }
.qisutu-public-form-mark { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 18px; border-radius: 50%; background: #dff5e7; color: #13713b; font-size: 30px; font-weight: 900; }
.qisutu-public-form-ticket-number { margin-top: 18px !important; color: #1f2933 !important; }
.qisutu-public-form-attachments { margin-top: 18px; }
.qisutu-ticket-reply-attachment-list { display: grid; gap: 8px; margin-top: 10px; }
.qisutu-ticket-reply-attachment { display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid #d5e0e6; border-radius: 7px; background: #f7fafb; padding: 8px 10px; }
.qisutu-ticket-reply-attachment button, .qisutu-attachment-limit-dialog button { border: 1px solid #00586d; border-radius: 6px; background: #fff; color: #00586d; cursor: pointer; font: inherit; font-weight: 700; padding: 6px 10px; }
.qisutu-attachment-limit-overlay { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; background: rgba(23, 34, 48, .55); padding: 18px; }
.qisutu-attachment-limit-overlay[hidden] { display: none; }
.qisutu-attachment-limit-dialog { width: min(460px, 100%); border-radius: 10px; background: #fff; box-shadow: 0 18px 50px rgba(0, 0, 0, .25); padding: 24px; }
.qisutu-attachment-limit-dialog h3 { margin: 0 0 12px; }
.qisutu-attachment-limit-dialog button { margin-top: 8px; background: #006078; color: #fff; }

@media (max-width: 620px) {
    .qisutu-public-form-shell { padding: 14px; }
    .qisutu-public-form-card { padding: 22px 18px; }
    .qisutu-ticket-form-fields { grid-template-columns: 1fr; }
    .qisutu-ticket-form-field-wide { grid-column: auto; }
}
