:root{
    --dark:#15130d;
    --dark-2:#21180c;
    --yellow:#ffce00;
    --orange:#f58a1f;
    --cream:#fff6df;
    --paper:#ffffff;
    --line:#eadfca;
    --text:#1f2933;
    --muted:#64748b;
    --danger:#dc2626;
    --success:#16a34a;
    --shadow:0 18px 45px rgba(42,29,12,.10);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
    font-family:Inter,Arial,sans-serif;
    background:linear-gradient(180deg,#fbf3e3 0%,#f5f0e8 100%);
    color:var(--text);
    min-height:100vh;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}

.app-shell{display:flex;min-height:100vh}
.sidebar{
    width:280px;
    background:linear-gradient(180deg,#17140e 0%,#0f0d09 100%);
    color:#fff;
    padding:24px 18px;
    position:fixed;
    inset:0 auto 0 0;
    overflow:auto;
    border-right:1px solid rgba(255,206,0,.14);
}
.brand{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:28px;
    padding:10px;
    border:1px solid rgba(255,206,0,.18);
    border-radius:20px;
    background:rgba(255,255,255,.04);
}
.brand-logo{
    width:86px;
    height:auto;
    object-fit:contain;
    background:transparent;
    border:0;
    box-shadow:none;
}
.brand-text strong{display:block;font-size:21px;color:var(--yellow);line-height:1.05}
.brand-text span{display:block;color:#e8e1d3;font-weight:700}
.menu{display:grid;gap:8px}
.menu a{
    padding:12px 14px;
    border-radius:14px;
    color:#e8e1d3;
    font-weight:800;
    transition:.2s ease;
}
.menu a:hover,.menu a.active{
    background:linear-gradient(135deg,var(--yellow),#ffd84d);
    color:var(--dark);
    transform:translateX(2px);
}
.main-content{margin-left:280px;width:calc(100% - 280px);padding:24px}
.topbar{
    background:rgba(255,255,255,.92);
    border:1px solid var(--line);
    border-radius:22px;
    padding:16px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    box-shadow:var(--shadow);
    margin-bottom:22px;
    backdrop-filter:blur(14px);
}
.topbar-brand{display:flex;align-items:center;gap:14px}
.topbar-logo{
    width:78px;
    height:auto;
    object-fit:contain;
    background:transparent;
    border:0;
    box-shadow:none;
}
.topbar strong{display:block;font-size:20px;color:var(--dark)}
.topbar span,.topbar small{display:block;color:var(--muted)}
.topbar-user{text-align:right}
.page-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:8px 0 20px}
.page-title h1{font-size:30px;color:var(--dark)}
.page-title p{color:var(--muted);margin-top:5px}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}
.card{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:20px;
    padding:18px;
    box-shadow:var(--shadow);
}
.card small{display:block;color:var(--muted);font-weight:800;margin-bottom:8px}
.card strong{font-size:26px;color:var(--dark)}
.card.warning{border-color:#f59e0b}
.card.success{border-color:#22c55e}
.card.danger{border-color:#ef4444}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.section{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:20px;
    padding:20px;
    box-shadow:var(--shadow);
    margin-bottom:18px;
}
.section h2{font-size:20px;margin-bottom:15px;color:var(--dark)}
.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.form-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.form-full{grid-column:1/-1}
label{display:block;font-weight:900;font-size:13px;margin-bottom:6px;color:#374151}
input,select,textarea{
    width:100%;
    border:1px solid #d8ccb8;
    border-radius:14px;
    padding:12px 13px;
    background:#fff;
    color:#111827;
    font:inherit;
    outline:none;
    transition:.18s ease;
}
input:focus,select:focus,textarea:focus{
    border-color:var(--yellow);
    box-shadow:0 0 0 4px rgba(255,206,0,.18);
}
textarea{min-height:90px;resize:vertical}
.btn{
    border:0;
    border-radius:14px;
    padding:12px 16px;
    font-weight:900;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    transition:.2s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--yellow),#ffd84d);color:var(--dark);box-shadow:0 12px 25px rgba(255,206,0,.26)}
.btn-dark{background:var(--dark);color:#fff}
.btn-danger{background:var(--danger);color:#fff}
.btn-light{background:#f3ead9;color:var(--dark)}
.btn-success{background:var(--success);color:#fff}
.btn-full{width:100%}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.table-wrap{width:100%;overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:760px}
th,td{padding:12px 10px;text-align:left;border-bottom:1px solid #efe4d0;vertical-align:top}
th{font-size:12px;text-transform:uppercase;color:#6b7280;background:#fbf6ec}
td{font-size:14px}
.badge{display:inline-flex;border-radius:999px;padding:6px 10px;font-weight:900;font-size:12px}
.badge-pendente{background:#fff7ed;color:#c2410c}
.badge-pago,.badge-conferido{background:#dcfce7;color:#166534}
.badge-atrasado,.badge-inativo{background:#fee2e2;color:#991b1b}
.badge-enviado{background:#dbeafe;color:#1d4ed8}
.badge-admin{background:#fef3c7;color:#92400e}
.badge-operador{background:#e0f2fe;color:#0369a1}
.badge-contador{background:#ede9fe;color:#6d28d9}
.alert{border-radius:16px;padding:14px 16px;margin-bottom:16px;font-weight:800}
.alert-success{background:#dcfce7;color:#166534}
.alert-danger{background:#fee2e2;color:#991b1b}
.alert-warning{background:#fff7ed;color:#9a3412}
.mt-10{margin-top:10px}
.mt-20{margin-top:20px}
.text-muted{color:var(--muted)}
.print-only{display:none}
.comment{border-left:4px solid var(--yellow);background:#fffaf0;border-radius:10px;padding:12px;margin:10px 0}
.comment small{color:var(--muted)}
.doc-preview{max-width:160px;border-radius:12px;border:1px solid var(--line)}
.filterbar{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:16px}
.filterbar>div{min-width:180px}
.no-print{}

/* Login */
.login-body{
    min-height:100svh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    overflow:auto;
    background:
        radial-gradient(circle at 88% 8%,rgba(255,206,0,.20) 0 0,transparent 300px),
        radial-gradient(circle at 8% 88%,rgba(245,138,31,.13) 0 0,transparent 260px),
        linear-gradient(135deg,#0f0d09 0%,#17140e 48%,#251908 100%);
    position:relative;
}
.login-body::before{
    content:"";
    position:fixed;
    width:420px;
    height:420px;
    right:-210px;
    top:-210px;
    border-radius:50%;
    background:linear-gradient(135deg,#fff3b8,var(--yellow));
    opacity:.35;
    filter:blur(1px);
    pointer-events:none;
}
.login-shell{
    width:min(460px,100%);
    display:block;
    position:relative;
    z-index:1;
}
.login-shell-single{max-width:460px}
.login-card{
    padding:36px;
    border-radius:32px;
    background:rgba(255,255,255,.97);
    border:1px solid rgba(255,255,255,.70);
    box-shadow:0 30px 80px rgba(0,0,0,.35);
}
.login-logo-card{
    width:100%;
    display:flex;
    justify-content:center;
    margin-bottom:20px;
}
.login-logo{
    width:240px;
    max-height:112px;
    object-fit:contain;
    background:transparent;
    border:0;
    box-shadow:none;
}
.login-card-title{text-align:center;margin-bottom:22px}
.login-card h2{font-size:31px;color:var(--dark);margin-bottom:6px;line-height:1.08}
.login-card p{color:var(--muted)}
.login-form{display:grid;gap:14px}
.field-group{display:grid;gap:6px}
.login-card input{
    min-height:46px;
    background:#fff;
}
.login-note{text-align:center;font-size:13px;margin-top:18px;color:var(--muted)}
.login-powered{
    text-align:center;
    margin-top:10px;
    color:#64748b;
    font-size:12px;
    font-weight:800;
}
.login-powered a{
    color:var(--dark);
    font-weight:950;
    border-bottom:1px solid rgba(255,206,0,.75);
}
.login-powered a:hover{
    color:#b77900;
}

.card .hint{display:block;margin-top:8px;color:var(--muted);font-size:12px;font-weight:700;line-height:1.35}

@media(max-width:1050px){
    .cards{grid-template-columns:repeat(2,1fr)}
    .grid-2,.grid-3{grid-template-columns:1fr}
    .form-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
    .sidebar{position:relative;width:100%;inset:auto;border-right:0;border-bottom:1px solid rgba(255,206,0,.14)}
    .app-shell{display:block}
    .main-content{margin-left:0;width:100%;padding:14px}
    .topbar,.page-title{align-items:flex-start;flex-direction:column}
    .topbar-user{text-align:left}
    .cards{grid-template-columns:1fr}
    .form-grid,.form-grid-2{grid-template-columns:1fr}
    .btn{width:100%}
    .actions .btn{width:auto}
    .brand-logo{width:92px}
    .topbar-logo{width:86px}
    .login-body{padding:16px;align-items:center}
    .login-body::before{width:250px;height:250px;right:-130px;top:-130px}
    .login-card{border-radius:24px;padding:28px 24px}
    .login-logo{width:210px}
    .login-card h2{font-size:27px}
}
@media(max-width:420px){
    .login-card{padding:24px 20px}
    .login-logo{width:185px}
    .login-card h2{font-size:25px}
}
@media print{
    body{background:#fff}
    .sidebar,.topbar,.no-print,.btn,.alert{display:none!important}
    .main-content{margin:0;width:100%;padding:0}
    .section{box-shadow:none;border:0}
    .print-only{display:block}
    table{min-width:0}
}

/* Área Falar com dev / Tickets */
.login-actions{
    margin-top:16px;
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
}
.login-dev-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:10px 16px;
    border-radius:999px;
    background:#fff8dc;
    border:1px solid #eadfca;
    color:var(--dark);
    font-weight:900;
    transition:.2s ease;
}
.login-dev-link:hover{
    transform:translateY(-1px);
    background:linear-gradient(135deg,var(--yellow),#ffd84d);
}
.login-shell-dev{
    width:min(680px,100%);
}
.login-dev-card{
    max-width:680px;
}
.dev-ticket-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}
.dev-ticket-form .form-full{
    grid-column:1/-1;
}
.ticket-card{
    border:1px solid var(--line);
    background:#fffaf0;
    border-radius:18px;
    padding:18px;
    margin-bottom:16px;
}
.ticket-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:14px;
    margin-bottom:14px;
}
.ticket-head h2{
    margin-bottom:4px;
}
.ticket-head p{
    color:var(--muted);
}
.ticket-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-bottom:14px;
}
.ticket-grid div,
.ticket-description{
    background:#fff;
    border:1px solid #efe4d0;
    border-radius:14px;
    padding:12px;
}
.ticket-grid strong,
.ticket-description strong{
    display:block;
    color:var(--muted);
    font-size:12px;
    text-transform:uppercase;
    margin-bottom:5px;
}
.ticket-grid span,
.ticket-description p{
    color:var(--text);
    font-weight:700;
}
.badge-dev{background:#fef3c7;color:#92400e}
.badge-aberto{background:#dbeafe;color:#1d4ed8}
.badge-em_andamento{background:#fef3c7;color:#92400e}
.badge-resolvido{background:#dcfce7;color:#166534}
.badge-cancelado{background:#fee2e2;color:#991b1b}

@media(max-width:760px){
    .dev-ticket-form{grid-template-columns:1fr}
    .ticket-head{flex-direction:column}
    .ticket-grid{grid-template-columns:1fr}
}

/* Atualização: ticket público, conversa e status encerrado */
.badge-encerrado{background:#e5e7eb;color:#374151}
.ticket-thread{
    margin-top:16px;
    background:#fff;
    border:1px solid #efe4d0;
    border-radius:16px;
    padding:14px;
}
.ticket-thread>strong{
    display:block;
    color:var(--muted);
    font-size:12px;
    text-transform:uppercase;
    margin-bottom:10px;
}
.thread-message{
    border-radius:14px;
    padding:12px;
    margin:10px 0;
    border:1px solid #eee1ca;
    background:#fffaf0;
}
.thread-dev{background:#fff8dc;border-color:#f7d44a}
.thread-cliente{background:#f8fafc;border-color:#dbe3ef}
.thread-sistema{background:#f3f4f6;border-color:#e5e7eb;color:#4b5563}
.thread-meta{
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    margin-bottom:6px;
}
.thread-message p{
    margin:0;
    color:var(--text);
    line-height:1.5;
}
.ticket-public-body{
    align-items:flex-start;
    padding:34px 16px;
}
.public-ticket-shell{
    width:min(820px,100%);
    position:relative;
    z-index:1;
}
.public-ticket-card{
    width:100%;
}
.ticket-public-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:14px;
    margin-bottom:18px;
}
.ticket-public-header h1{
    font-size:30px;
    color:var(--dark);
    line-height:1.1;
    margin-bottom:6px;
}
.ticket-public-header p{color:var(--muted)}
.ticket-card a,
.public-ticket-card a{
    color:#1d4ed8;
    font-weight:900;
}
@media(max-width:760px){
    .ticket-public-header{flex-direction:column}
    .public-ticket-card{padding:24px 18px}
}

.log-box{
    background:#111827;
    color:#e5e7eb;
    padding:16px;
    border-radius:16px;
    overflow:auto;
    white-space:pre-wrap;
    font-size:13px;
    line-height:1.6;
}
.align-end{
    align-self:end;
}

/* Atualização: tickets pequenos, última resposta e encerrados separados */
.ticket-group-header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:14px;
    margin:18px 0 12px;
    padding:14px 16px;
    border-radius:16px;
    background:#fffaf0;
    border:1px solid #efe4d0;
}
.ticket-group-header h3{
    margin:0 0 3px;
    color:var(--dark);
    font-size:19px;
}
.ticket-group-header p{
    margin:0;
    color:var(--muted);
    font-size:13px;
}
.ticket-group-header>span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#fff;
    border:1px solid #efe4d0;
    padding:8px 12px;
    font-size:13px;
    font-weight:900;
    color:var(--dark);
    white-space:nowrap;
}
.ticket-group-closed{
    margin-top:30px;
    background:#f3f4f6;
    border-color:#e5e7eb;
}
.ticket-mini-list{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:12px;
}
.ticket-mini-card{
    border:1px solid #efe4d0;
    background:#fff;
    border-radius:18px;
    padding:14px;
    box-shadow:0 10px 26px rgba(25,21,12,.06);
}
.ticket-mini-card.ticket-mini-closed,
.ticket-mini-list-closed .ticket-mini-card{
    background:#f9fafb;
    border-color:#e5e7eb;
}
.ticket-mini-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;
}
.ticket-mini-top h3{
    margin:0 0 4px;
    font-size:17px;
    line-height:1.25;
    color:var(--dark);
}
.ticket-mini-top p{
    margin:0;
    color:var(--muted);
    font-size:12px;
    font-weight:800;
}
.ticket-mini-top .badge{
    white-space:nowrap;
    padding:5px 9px;
    font-size:11px;
}
.ticket-mini-last{
    border:1px dashed #eadfca;
    background:#fffaf0;
    border-radius:14px;
    padding:10px;
    margin-bottom:10px;
}
.ticket-mini-closed .ticket-mini-last,
.ticket-mini-list-closed .ticket-mini-last{
    background:#fff;
    border-color:#e5e7eb;
}
.ticket-mini-last strong{
    display:inline-block;
    color:var(--dark);
    font-size:13px;
    margin-right:6px;
}
.ticket-mini-last span{
    color:var(--muted);
    font-size:12px;
    font-weight:800;
}
.ticket-mini-last p{
    margin:6px 0 0;
    color:var(--text);
    font-size:14px;
    line-height:1.4;
}
.ticket-mini-contact{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:10px;
}
.ticket-mini-contact span{
    display:inline-flex;
    padding:6px 9px;
    border-radius:999px;
    background:#f8fafc;
    border:1px solid #e5e7eb;
    color:#475569;
    font-size:12px;
    font-weight:800;
}
.ticket-mini-details{
    border-top:1px solid #efe4d0;
    padding-top:10px;
    margin-top:8px;
}
.ticket-mini-details summary{
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    background:var(--dark);
    color:#fff;
    padding:8px 12px;
    font-weight:900;
    font-size:13px;
    list-style:none;
}
.ticket-mini-details summary::-webkit-details-marker{display:none}
.ticket-mini-details[open] summary{
    margin-bottom:12px;
    background:linear-gradient(135deg,var(--yellow),#ffd84d);
    color:var(--dark);
}
.ticket-actions-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
    margin-bottom:12px;
}
.btn-sm{
    min-height:34px;
    padding:8px 12px;
    font-size:12px;
}
@media(max-width:760px){
    .ticket-mini-list{grid-template-columns:1fr}
    .ticket-group-header{align-items:flex-start;flex-direction:column}
    .ticket-mini-top{flex-direction:column}
}


/* Ajuste: tickets encerrados ainda menores e sem prévia da última mensagem */
.ticket-mini-list-closed{
    grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
    gap:8px;
}
.ticket-group-closed{
    padding:10px 12px;
    margin-top:24px;
}
.ticket-group-closed h3{
    font-size:15px;
    margin-bottom:1px;
}
.ticket-group-closed p{
    font-size:11px;
}
.ticket-group-closed>span{
    padding:5px 9px;
    font-size:11px;
}
.ticket-mini-list-closed .ticket-mini-card{
    padding:9px 10px;
    border-radius:12px;
    box-shadow:none;
}
.ticket-mini-list-closed .ticket-mini-top{
    align-items:center;
    margin-bottom:4px;
    gap:8px;
}
.ticket-mini-list-closed .ticket-mini-top h3{
    font-size:13px;
    margin-bottom:2px;
    line-height:1.2;
}
.ticket-mini-list-closed .ticket-mini-top p{
    font-size:10px;
    font-weight:700;
}
.ticket-mini-list-closed .ticket-mini-top .badge{
    padding:3px 7px;
    font-size:9px;
}
.ticket-mini-list-closed .ticket-mini-details{
    border-top:0;
    padding-top:3px;
    margin-top:2px;
}
.ticket-mini-list-closed .ticket-mini-details summary{
    padding:5px 8px;
    font-size:11px;
}
.ticket-mini-list-closed .ticket-actions-row{
    margin-top:8px;
}


/* Ajuste: mensagem de ticket criado sem estourar o card */
.ticket-created-box{
    margin-bottom:18px;
    padding:16px;
    border-radius:20px;
    background:linear-gradient(135deg,#dcfce7,#f0fdf4);
    border:1px solid #bbf7d0;
    color:#14532d;
    box-shadow:0 12px 28px rgba(22,101,52,.10);
    overflow:hidden;
}
.ticket-created-top{
    display:flex;
    align-items:flex-start;
    gap:12px;
}
.ticket-created-icon{
    width:34px;
    height:34px;
    min-width:34px;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#16a34a;
    color:#fff;
    font-weight:900;
    box-shadow:0 8px 18px rgba(22,163,74,.25);
}
.ticket-created-top strong{
    display:block;
    font-size:16px;
    line-height:1.3;
}
.ticket-created-top p{
    margin-top:4px;
    color:#166534;
    font-size:13px;
    line-height:1.35;
}
.ticket-created-actions{
    margin-top:14px;
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}
.ticket-created-actions .btn{
    width:auto;
}
.ticket-created-link{
    display:grid;
    gap:6px;
    margin-top:12px;
    font-weight:900;
    color:#14532d;
}
.ticket-created-link span{
    font-size:12px;
}
.ticket-created-link input{
    width:100%;
    max-width:100%;
    min-height:40px;
    border-radius:12px;
    border:1px solid #86efac;
    background:#fff;
    color:#14532d;
    font-size:12px;
    font-weight:800;
    padding:0 12px;
    box-sizing:border-box;
    overflow:hidden;
    text-overflow:ellipsis;
}
.alert a{
    overflow-wrap:anywhere;
    word-break:break-word;
}
@media(max-width:520px){
    .ticket-created-box{padding:14px;border-radius:16px}
    .ticket-created-top{gap:10px}
    .ticket-created-top strong{font-size:14px}
    .ticket-created-actions .btn{width:100%}
}