:root{
--ink:#172331;
--muted:#647487;
--line:#d8e1ea;
--paper:#f3f6f9;
--surface:#ffffff;
--primary:#1d5f91;
--primary-deep:#0e304d;
--primary-hover:#174d76;
--primary-soft:#e6f0f8;
--primary-text-soft:#c4d9e9;
--accent:#79bce8;
--sidebar-text:#dce8f1;
--sidebar-muted:#9fb8ca;
--sidebar-line:#31546e;
--sidebar-active-group:rgba(255,255,255,.055);
--red:#b5453c;
--red-soft:#f8dfdd;
--red-text:#943a33;
--red-light:#ffb3aa;
--amber:#b47b25;
--amber-soft:#fff0d1;
--amber-text:#916117;
--green-status:#2a7358;
--green-soft:#daf0e2;
--green-text:#28724a;
--blue-soft:#dfeef7;
--blue-text:#2b6385;
--neutral-soft:#edf2f6;
--neutral-text:#557082;
--panel-muted:#e8eef3;
--input-line:#c8d3de;
--empty-text:#94a1ae;
--print-canvas:#dddddd;
--shadow:0 8px 26px rgba(16,48,75,.08);
--shadow-deep:0 22px 70px rgba(0,0,0,.22);
--shadow-card:0 2px 6px rgba(0,0,0,.05);
--shadow-print:0 5px 25px rgba(0,0,0,.18);
--shadow-autocomplete:0 12px 30px rgba(22,47,73,.18);
}
[hidden]{display:none!important}
*{
box-sizing:border-box
}
html{
font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
color:var(--ink);
background:var(--paper)
}
body{
margin:0;
display:grid;
grid-template-columns:232px 1fr;
min-height:100vh
}
aside{
position:sticky;
top:0;
height:100vh;
background:var(--primary-deep);
color:var(--sidebar-text);
padding:28px 18px 20px;
display:flex;
flex-direction:column;
overflow-y:auto
}
.brand{
display:flex;
gap:11px;
align-items:center;
padding:0 10px 27px
}
.brand strong{
display:block;
font:700 18px Georgia;
line-height:1.2
}
.brand a{
color:var(--sidebar-muted);
font-size:11px;
line-height:1.4;
text-decoration:none
}
.sidebar-nav{
display:grid;
gap:13px
}
.nav-group{
display:block;
padding:6px;
border:1px solid transparent;
border-radius:10px
}
.nav-group.active-group{
background:var(--sidebar-active-group);
border-color:var(--sidebar-line)
}
.nav-group summary{
font:800 9px/1.2 Inter,ui-sans-serif,sans-serif;
letter-spacing:.13em;
color:var(--sidebar-muted);
padding:5px 6px;
cursor:pointer;
list-style-position:inside
}
.nav-group[open] summary{
margin-bottom:4px
}
.sidebar-nav a{
color:var(--sidebar-muted);
text-decoration:none;
display:block;
padding:8px 9px;
border-radius:8px;
font-size:13px;
font-weight:600
}
.sidebar-nav a:hover,.sidebar-nav a.active{
background:var(--primary-hover);
color:var(--surface)
}
.aside-foot{
margin-top:auto;
padding:16px 10px 0;
border-top:1px solid var(--sidebar-line);
color:var(--sidebar-muted);
font-size:11px
}
.dot{
display:inline-block;
width:7px;
height:7px;
border-radius:50%;
background:var(--green-status);
margin-right:8px
}
main{
min-width:0
}
main>header{
height:105px;
background:var(--surface);
border-bottom:1px solid var(--line);
display:flex;
align-items:center;
justify-content:space-between;
padding:24px 34px
}
h1{
font:700 30px Georgia,serif;
margin:3px 0
}
h2{
font:700 20px Georgia,serif;
margin:0
}
.eyebrow{
font-size:10px;
letter-spacing:.16em;
color:var(--primary);
font-weight:800;
margin:0
}
.header-actions{
display:flex;
gap:18px;
align-items:center
}
.month-picker{
display:flex;
align-items:center;
gap:8px;
border:1px solid var(--line);
background:var(--paper);
padding:7px 10px;
border-radius:8px
}
.month-picker span{
font-size:10px;
text-transform:uppercase;
color:var(--muted);
font-weight:800
}
.month-picker input{
border:0;
background:none;
font-weight:700
}
.content{
padding:28px 34px 52px;
max-width:1680px;
margin:auto
}
main>footer{
text-align:center;
color:var(--empty-text);
font-size:11px;
padding:20px
}
.metric-grid{
display:grid;
grid-template-columns:1.2fr repeat(4,1fr);
gap:14px;
margin-bottom:18px
}
.metric{
background:var(--surface);
border:1px solid var(--line);
border-radius:12px;
padding:20px;
min-height:164px;
box-shadow:var(--shadow)
}
.metric>span,.balance>span{
display:block;
color:var(--muted);
font-size:11px;
text-transform:uppercase;
letter-spacing:.08em;
font-weight:700
}
.metric>strong{
display:block;
font:700 29px Georgia;
margin:15px 0 5px
}
.metric>small{
color:var(--muted)
}
.metric>footer{
font-size:10px;
color:var(--muted);
border-top:1px solid var(--line);
padding-top:12px;
margin-top:15px
}
.metric.hero{
background:var(--primary);
color:var(--surface);
border-color:var(--primary)
}
.metric.hero>span{
color:var(--primary-text-soft)
}
.metric.hero>strong{
font-size:36px
}
.metric.hero>div{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:8px;
margin-top:22px
}
.metric.hero em{
font-style:normal;
font-size:10px;
color:var(--primary-text-soft)
}
.metric.hero b{
display:block;
color:var(--surface);
font-size:14px;
margin-top:3px
}
.metric.attention{
border-color:var(--red)
}
.metric.attention>strong{
color:var(--red)
}
.metric.confirmed{
border-color:var(--green-status)
}
.metric.confirmed>strong{
color:var(--green-status)
}
.split{
height:5px;
background:var(--primary-soft);
border-radius:8px;
margin-top:16px;
overflow:hidden
}
.split i{
display:block;
background:var(--accent);
height:100%;
width:var(--w)
}
.two-col,.detail-grid{
display:grid;
grid-template-columns:1.4fr 1fr;
gap:18px;
margin-top:18px
}
.panel{
background:var(--surface);
border:1px solid var(--line);
border-radius:12px;
box-shadow:var(--shadow);
overflow:hidden
}
.panel-head{
display:flex;
justify-content:space-between;
align-items:center;
padding:20px 22px;
border-bottom:1px solid var(--line)
}
.count{
background:var(--neutral-soft);
border-radius:99px;
padding:3px 8px;
font-size:11px
}
.needs{
padding:10px
}
.need{
display:grid;
grid-template-columns:130px 1fr auto;
text-decoration:none;
color:var(--ink);
gap:14px;
align-items:center;
padding:13px;
border-bottom:1px solid var(--neutral-soft);
font-size:12px
}
.need b{
color:var(--amber)
}
.need.danger b{
color:var(--red)
}
.need strong{
color:var(--primary)
}
.delin-grid{
display:grid;
grid-template-columns:1fr 1fr
}
.delin-grid>div{
padding:26px 22px
}
.delin-grid>div+div{
border-left:1px solid var(--line)
}
.delin-grid span,.delin-grid small{
display:block;
color:var(--muted);
font-size:11px
}
.delin-grid strong{
display:block;
font:700 25px Georgia;
color:var(--red);
margin:8px 0
}
.button,button{
background:var(--primary);
color:var(--surface);
border:0;
border-radius:7px;
padding:10px 14px;
font-weight:700;
font-size:12px;
cursor:pointer;
text-decoration:none;
display:inline-block
}
.ghost{
background:var(--surface)!important;
color:var(--primary)!important;
border:1px solid var(--primary-text-soft)!important
}
.danger-btn{
background:var(--red)
}
.toolbar{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:16px;
gap:12px
}
.toolbar>p{
color:var(--muted);
font-size:12px
}
.toolbar>div{
display:flex;
gap:8px
}
.drawer{
display:inline-block;
position:relative
}
.drawer[open]>form{
position:fixed;
z-index:10;
top:110px;
right:35px;
width:min(720px,calc(100vw - 280px));
max-height:calc(100vh - 145px);
overflow:auto;
background:var(--surface);
padding:26px;
border:1px solid var(--line);
border-radius:12px;
box-shadow:var(--shadow-deep)
}
summary{
list-style:none;
cursor:pointer
}
.form-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px
}
.form-grid h3,.form-grid .wide,.form-actions,.hint{
grid-column:1/-1
}
.form-grid label,.inline-action label,.transition-form label{
display:grid;
gap:6px
}
.form-grid label>span,.inline-action label>span,.transition-form label>span{
font-size:10px;
font-weight:800;
color:var(--muted);
text-transform:uppercase;
letter-spacing:.06em
}
input,select,textarea{
width:100%;
border:1px solid var(--input-line);
border-radius:7px;
padding:10px 11px;
background:var(--surface);
color:var(--ink);
font:inherit;
font-size:13px
}
textarea{
min-height:82px
}
.form-actions{
text-align:right;
padding-top:5px
}
.payer{
grid-column:1/-1
}
.payer select{
border:2px solid var(--amber);
font-weight:800
}
.table-wrap{
max-width:100%;
overflow:auto
}
table{
border-collapse:collapse;
width:100%;
font-size:12px
}
th{
text-align:left;
font-size:9px;
letter-spacing:.1em;
text-transform:uppercase;
color:var(--muted);
padding:12px 16px;
background:var(--paper);
border-bottom:1px solid var(--line)
}
td{
padding:14px 16px;
border-bottom:1px solid var(--neutral-soft);
vertical-align:middle
}
td small,td>a+small{
display:block;
color:var(--muted);
margin-top:4px
}
.primary{
color:var(--primary);
font-weight:800;
text-decoration:none
}
.badge{
display:inline-block;
background:var(--neutral-soft);
color:var(--neutral-text);
padding:4px 7px;
border-radius:99px;
font-size:9px;
font-weight:800;
text-transform:uppercase;
letter-spacing:.04em;
white-space:nowrap
}
.badge.alugado,.badge.paga,.badge.fechado,.badge.aprovada,.badge.concluida,.badge.conciliado{
background:var(--green-soft);
color:var(--green-text)
}
.badge.vago,.badge.parcial,.badge.aguardando_aprovacao,.badge.alta{
background:var(--amber-soft);
color:var(--amber-text)
}
.badge.em_reforma,.badge.aberta,.badge.emergencia,.badge.recusada,.badge.danger{
background:var(--red-soft);
color:var(--red-text)
}
.badge.section8,.badge.info{
background:var(--blue-soft);
color:var(--blue-text)
}
.positive,.credito{
color:var(--green-status)!important;
font-weight:800
}
.negative,.debito{
color:var(--red)!important;
font-weight:800
}
.empty{
text-align:center;
padding:32px;
color:var(--empty-text);
font-size:12px
}
.empty>span{
font-size:26px
}
.toast{
margin:18px 34px -8px;
padding:13px 16px;
border-radius:8px;
font-size:12px;
font-weight:700
}
.toast.success{
background:var(--green-soft);
color:var(--green-text)
}
.toast.error{
background:var(--red-soft);
color:var(--red-text)
}
.directory-wrap{
overflow-x:auto
}
.directory-table{
min-width:860px
}
.directory-row td{
height:52px;
padding:13px 16px
}
.directory-row td:first-child{
padding:0
}
.directory-row:hover{
background:var(--primary-soft)
}
.vacancy-directory{
min-width:980px
}
.vacancy-directory>tbody.directory-row+tbody.directory-row .vacancy-info-row td{
border-top:8px solid var(--panel-muted)
}
.vacancy-info-row td{
vertical-align:top
}
.vacancy-observation{
min-width:190px;
max-width:250px;
white-space:normal
}
.vacancy-column-label{
display:none
}
.vacancy-action-row td:first-child{
background:var(--panel-muted);
padding:10px 16px 14px
}
.vacancy-row-actions{
display:flex;
flex-wrap:wrap;
align-items:flex-end;
gap:8px;
min-width:0;
width:100%
}
.vacancy-row-actions form{
display:flex;
flex:1 1 780px;
flex-wrap:wrap;
align-items:flex-end;
gap:8px;
margin:0;
min-width:0
}
.vacancy-observation-entry{
display:flex;
flex:1 1 260px;
flex-direction:column;
gap:3px;
min-width:240px
}
.vacancy-observation-entry span{
font-size:10px;
font-weight:700
}
.vacancy-observation-entry input{
min-width:0;
width:100%
}
.vacancy-row-actions button,
.vacancy-row-actions .button{
flex:0 0 auto;
max-width:none;
white-space:nowrap
}
.vacancy-row-actions p{
margin:0;
font-size:10px
}
.custody-directory{
min-width:1120px
}
.custody-row-actions{
display:flex;
align-items:center;
gap:6px;
min-width:245px
}
.custody-row-actions .button{
white-space:nowrap
}
.custody-action-disabled{
cursor:not-allowed;
opacity:.45
}
.custody-totals{
margin-bottom:18px
}
.custody-unidentified small{
display:block;
margin-top:7px;
color:var(--muted);
font-size:10px;
line-height:1.35
}
.custody-editor{
margin-bottom:18px
}
.directory-cell{
display:block;
min-height:52px;
padding:13px 16px;
color:var(--ink);
text-decoration:none
}
.property-identity b{
font-size:13px
}
.directory-cell small{
display:block;
margin-top:4px;
color:var(--muted)
}
.money-cell{
font-weight:800;
white-space:nowrap
}
.receipt-filters{
flex-wrap:wrap
}
.receipt-totals{
grid-template-columns:repeat(3,minmax(0,1fr))
}
.receipt-totals .metric{
min-height:130px
}
.receipt-directory{
min-width:1120px
}
.filters{
display:flex;
gap:8px
}
.detail-hero{
background:var(--primary);
color:var(--surface);
border-radius:13px;
padding:25px 28px;
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:18px
}
.detail-hero h2{
font-size:28px;
margin:6px 0
}
.detail-hero p{
color:var(--primary-text-soft);
margin:0
}
.back{
color:var(--primary);
font-size:11px;
font-weight:800;
text-decoration:none
}
.detail-hero .back{
color:var(--accent)
}
.balance{
text-align:right
}
.balance strong{
display:block;
font:700 29px Georgia;
margin-top:6px
}
.balance.negative strong{
color:var(--red-light)
}
.property-list{
padding:12px
}
.property-chip,.report-row{
display:flex;
align-items:center;
gap:10px;
text-decoration:none;
color:var(--ink);
padding:13px 10px;
border-bottom:1px solid var(--line)
}
.property-chip b{
width:120px
}
.property-chip span:not(.badge){
flex:1;
color:var(--muted);
font-size:11px
}
.report-row{
justify-content:space-between
}
.report-row span small{
display:block;
color:var(--muted);
margin-top:4px
}
.owner-line,.lease-line{
padding:16px 20px;
border-bottom:1px solid var(--line)
}
.owner-line span{
margin-left:8px;
color:var(--primary);
font-weight:800
}
.owner-line small{
display:block;
color:var(--muted);
margin-top:4px
}
.lease-line{
display:grid;
grid-template-columns:1fr auto;
gap:5px
}
.lease-line small{
grid-column:1/-1;
color:var(--muted);
line-height:1.5
}
.filter-pill{
padding:7px 12px;
border-radius:99px;
background:var(--primary-soft);
color:var(--muted);
font-size:11px;
text-decoration:none;
font-weight:700
}
.filter-pill.active{
background:var(--primary);
color:var(--surface)
}
.inline-action{
position:relative
}
.inline-action>summary{
color:var(--primary);
font-weight:800;
font-size:11px
}
.inline-action>form{
position:absolute;
z-index:4;
right:0;
top:25px;
background:var(--surface);
border:1px solid var(--line);
box-shadow:var(--shadow);
padding:14px;
border-radius:8px;
width:250px;
display:grid;
gap:9px
}
.soft-label{
display:block;
color:var(--amber);
font-size:8px;
font-weight:800;
margin-top:4px
}
.kanban,.funnel{
display:flex;
gap:12px;
overflow-x:auto;
padding-bottom:12px;
align-items:flex-start
}
.kanban-col{
min-width:245px;
width:245px;
background:var(--panel-muted);
border-radius:10px;
padding:10px
}
.kanban-col>header{
display:flex;
justify-content:space-between;
text-transform:uppercase;
font-size:9px;
letter-spacing:.08em;
padding:5px 5px 12px
}
.kanban-col>header span{
background:var(--line);
border-radius:99px;
padding:2px 7px
}
.wo-card{
display:block;
background:var(--surface);
border-radius:8px;
padding:13px;
margin-bottom:9px;
text-decoration:none;
color:var(--ink);
box-shadow:var(--shadow-card)
}
.wo-card>div,.wo-card footer{
display:flex;
justify-content:space-between;
align-items:center
}
.wo-card>div>span{
font-size:9px;
color:var(--muted);
font-weight:800
}
.wo-card h3{
font:700 15px Georgia;
margin:12px 0 5px
}
.wo-card p{
font-size:11px;
color:var(--muted);
height:30px;
overflow:hidden
}
.wo-card footer{
border-top:1px solid var(--line);
padding-top:9px;
font-size:9px
}
.refused{
padding:12px;
display:flex;
gap:12px;
font-size:11px
}
.timeline-panel{
margin:18px 0;
padding:22px
}
.timeline{
display:flex;
list-style:none;
margin:0;
padding:0
}
.timeline li{
flex:1;
position:relative;
text-align:center;
font-size:8px;
text-transform:uppercase;
color:var(--empty-text)
}
.timeline li:before{
content:"";
height:2px;
background:var(--line);
position:absolute;
top:6px;
left:0;
right:0
}
.timeline i{
position:relative;
z-index:1;
display:block;
width:13px;
height:13px;
border-radius:50%;
background:var(--input-line);
margin:0 auto 8px
}
.timeline .done:before,.timeline .done i{
background:var(--green-status)
}
.timeline .done{
color:var(--green-status)
}
.data-list{
padding:10px 22px
}
.data-list div{
display:flex;
justify-content:space-between;
padding:10px 0;
border-bottom:1px solid var(--line)
}
.data-list dt{
color:var(--muted)
}
.data-list dd{
font-weight:800
}
.action-panel{
padding-bottom:15px
}
.transition-form{
padding:15px 20px;
display:grid;
gap:10px;
border-bottom:1px solid var(--line)
}
.funnel-intro,.dre-intro,.closing-intro{
display:flex;
justify-content:space-between;
align-items:flex-end;
background:var(--primary);
color:var(--surface);
padding:22px 26px;
border-radius:12px;
margin-bottom:18px
}
.funnel-intro p,.dre-intro p{
max-width:480px;
color:var(--primary-text-soft);
font-size:12px
}
.funnel-col{
min-width:275px;
width:275px;
background:var(--panel-muted);
border-radius:10px;
padding:10px
}
.funnel-col>header{
padding:7px
}
.funnel-col>header>div{
display:flex;
justify-content:space-between
}
.funnel-col>header b{
text-transform:uppercase;
font-size:10px
}
.funnel-col>header span,.funnel-col>header small{
display:block;
color:var(--muted);
font-size:9px
}
.funnel-col>header strong{
display:block;
font:700 19px Georgia;
margin:10px 0 3px
}
.vacancy-card{
background:var(--surface);
border-radius:9px;
padding:14px;
margin-top:10px
}
.vacancy-card>div{
display:flex;
justify-content:space-between;
color:var(--muted);
font-size:9px
}
.vacancy-card h3{
font:700 17px Georgia;
margin:10px 0 4px
}
.vacancy-card p{
font-size:11px;
color:var(--red)
}
.vacancy-card dl{
display:grid;
grid-template-columns:1fr auto;
font-size:10px
}
.vacancy-card dd{
font-weight:800
}
.vacancy-card form{
display:grid;
gap:6px;
margin-top:10px
}
.vacancy-card>.vacancy-actions{
display:flex;
flex-wrap:wrap;
justify-content:flex-start;
gap:6px;
margin-top:10px
}
.vacancy-card>.vacancy-actions form{
margin-top:0
}
.vacancy-card a{
font-size:10px;
color:var(--primary);
font-weight:800
}
.closing-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:14px
}
.closing-card{
background:var(--surface);
border:1px solid var(--line);
border-radius:11px;
padding:18px
}
.closing-card>div,.closing-card dl div{
display:flex;
justify-content:space-between
}
.closing-card dl{
display:grid;
grid-template-columns:1fr auto;
gap:9px;
font-size:11px;
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
padding:14px 0
}
.closing-card dt{
color:var(--muted)
}
.closing-card dd{
font-weight:800
}
.closing-card footer{
display:flex;
gap:8px;
align-items:center;
padding-top:12px
}
.note{
background:var(--amber-soft);
color:var(--amber-text);
padding:12px;
border-radius:8px;
margin-bottom:14px;
font-size:11px
}
.danger-note{
background:var(--red-soft);
color:var(--red-text)
}
.danger-note a{
color:var(--red-text);
font-weight:800
}
.bank-columns{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:14px
}
.bank-origin{
grid-template-columns:minmax(430px,1.6fr) minmax(260px,1fr) minmax(260px,1fr)
}
.bank-columns>section{
background:var(--panel-muted);
border-radius:11px;
padding:10px;
min-height:430px
}
.bank-columns>section>header{
display:flex;
gap:10px;
padding:8px
}
.bank-columns>section>header i{
width:8px;
height:8px;
border-radius:50%;
margin-top:4px
}
.red{
background:var(--red)
}
.amber{
background:var(--amber)
}
.green{
background:var(--green-status)
}
.bank-columns>section>header b,.bank-columns>section>header span{
display:block;
font-size:10px
}
.bank-columns>section>header span{
color:var(--muted);
margin-top:3px
}
.bank-row{
background:var(--surface);
border-radius:8px;
padding:13px;
margin-top:9px
}
.bank-row>div{
display:flex;
justify-content:space-between
}
.bank-row p{
font-size:11px
}
.bank-row small{
color:var(--muted)
}
.bank-row>small{
display:block;
margin-top:5px
}
.bank-row form{
display:grid;
gap:5px
}
.suggestion{
display:block;
margin-top:8px;
padding:7px;
border-radius:6px;
background:var(--blue-soft);
color:var(--blue-text);
font-size:10px;
font-weight:700
}
.inline-autocomplete-menu{
position:fixed;
z-index:30;
display:grid;
max-height:260px;
overflow-y:auto;
padding:5px;
border:1px solid var(--line);
border-radius:8px;
background:var(--surface);
box-shadow:var(--shadow-autocomplete)
}
.inline-autocomplete-menu[hidden]{
display:none
}
.inline-autocomplete-menu button{
width:100%;
padding:8px 10px;
border:0;
border-radius:5px;
background:transparent;
color:var(--ink);
text-align:left;
font:inherit;
cursor:pointer
}
.inline-autocomplete-menu button:hover,
.inline-autocomplete-menu button.active{
background:var(--blue-soft);
color:var(--blue-text)
}
.classification-drawer{
margin-top:12px
}
.classification-drawer>summary{
width:100%;
text-align:center
}
.classification-drawer[open]>.classification-grid{
position:fixed;
z-index:12;
top:72px;
left:260px;
right:28px;
max-height:calc(100vh - 100px);
overflow:auto;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px;
padding:22px;
border:1px solid var(--line);
border-radius:12px;
background:var(--paper);
box-shadow:var(--shadow-deep)
}
.bank-action{
align-content:start;
gap:10px!important;
padding:16px;
border:1px solid var(--line);
border-radius:9px;
background:var(--surface)
}
.bank-action h4{
margin:0;
font:700 16px Georgia
}
.bank-action p{
margin:0;
color:var(--muted)
}
.bank-action label{
display:grid;
gap:5px
}
.bank-action label>span{
font-size:9px;
font-weight:800;
text-transform:uppercase;
letter-spacing:.06em;
color:var(--muted)
}
.allocation-list{
display:grid;
gap:6px;
max-height:250px;
overflow:auto
}
.allocation-row{
grid-template-columns:auto minmax(0,1fr) 112px;
align-items:center;
gap:9px!important;
padding:8px;
border:1px solid var(--line);
border-radius:7px
}
.allocation-row>input[type="checkbox"]{
width:auto
}
.allocation-row b,.allocation-row small{
display:block
}
.allocation-row strong{
text-align:right;
font-size:11px
}
.allocation-values{
display:grid;
grid-template-columns:auto 112px;
align-items:center;
gap:5px 8px
}
.allocation-values>span{
font-size:9px;
font-weight:800;
text-transform:uppercase;
color:var(--muted)
}
.sum-check{
display:flex;
justify-content:space-between;
gap:12px;
padding:9px;
border-radius:7px;
background:var(--primary-soft);
color:var(--primary);
font-size:11px
}
.bank-action button:disabled{
opacity:.45;
cursor:not-allowed
}
.bank-action.compact{
align-self:start
}
.ignored-row form{
margin-top:10px
}
.bank-account-head{
display:flex;
justify-content:space-between;
align-items:end;
gap:16px;
margin-bottom:16px
}
.account-selector{
display:flex;
align-items:end;
gap:8px
}
.account-selector label{
display:grid;
gap:6px;
min-width:280px
}
.account-selector label span{
font-size:10px;
font-weight:800;
text-transform:uppercase;
letter-spacing:.08em;
color:var(--muted)
}
.bank-account-actions{
display:flex;
gap:8px
}
.account-balance{
margin-bottom:18px
}
.account-balance-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px
}
.account-balance-grid article{
background:var(--surface);
border:1px solid var(--line);
border-radius:10px;
padding:17px;
box-shadow:var(--shadow-card)
}
.account-balance-grid article>span{
display:block;
color:var(--muted);
font-size:9px;
font-weight:800;
letter-spacing:.07em;
text-transform:uppercase
}
.account-balance-grid article>strong{
display:block;
font:700 24px Georgia;
margin:12px 0 4px
}
.account-balance-grid article>small{
color:var(--muted)
}
.account-balance-grid .current-balance{
background:var(--primary);
border-color:var(--primary);
color:var(--surface)
}
.account-balance-grid .current-balance>span,
.account-balance-grid .current-balance>small{
color:var(--primary-text-soft)
}
.entry{
color:var(--green-status)
}
.exit{
color:var(--red)
}
.balance-note,
.balance-check{
margin:12px 0;
padding:12px 15px;
border-radius:8px
}
.balance-check{
display:flex;
justify-content:space-between;
gap:12px;
font-size:11px
}
.balance-check.matches{
background:var(--green-soft);
color:var(--green-text)
}
.balance-check.differs{
background:var(--red-soft);
color:var(--red-text)
}
.balance-drawer{
margin-top:10px
}
.bank-statement{
background:var(--surface);
border:1px solid var(--line);
border-radius:12px;
overflow:hidden
}
.statement-toolbar{
display:flex;
justify-content:space-between;
align-items:end;
gap:18px;
padding:20px 22px;
border-bottom:1px solid var(--line)
}
.statement-toolbar h2{
margin:3px 0 0
}
.statement-filters{
display:flex;
gap:7px
}
.statement-filters a{
display:flex;
gap:6px;
padding:7px 10px;
border:1px solid var(--line);
border-radius:99px;
font-size:10px;
color:var(--muted)
}
.statement-filters a.active{
background:var(--primary);
border-color:var(--primary);
color:var(--surface)
}
.statement-columns,
.statement-row{
display:grid;
grid-template-columns:105px minmax(220px,1fr) 130px minmax(260px,.8fr);
gap:16px;
align-items:start
}
.statement-columns{
padding:9px 18px;
background:var(--panel-muted);
font-size:9px;
font-weight:800;
letter-spacing:.07em;
text-transform:uppercase;
color:var(--muted)
}
.statement-columns span:nth-child(3){
text-align:right
}
.statement-row.bank-row{
border-radius:0;
border-bottom:1px solid var(--line);
margin:0;
padding:15px 18px
}
.statement-row>time{
font-size:11px;
font-weight:700
}
.statement-row>.statement-description,
.statement-row>.statement-status{
display:block
}
.statement-description p{
margin:0 0 5px;
line-height:1.4
}
.statement-value{
text-align:right;
font-size:12px
}
.statement-status .badge{
margin-bottom:7px
}
.badge.pendente{
background:var(--amber-soft);
color:var(--amber-text)
}
.badge.ignorado{
background:var(--neutral-soft);
color:var(--neutral-text)
}
.classification-parts{
display:grid;
gap:4px;
list-style:none;
padding:0;
margin:0 0 8px;
font-size:10px;
color:var(--muted)
}
.classification-parts li b{
display:block;
color:var(--ink)
}
.statement-row>.classification-drawer{
grid-column:1/-1;
margin:0
}
.dre-card{
background:var(--surface);
border:1px solid var(--line);
border-radius:12px;
margin-bottom:16px;
overflow:hidden
}
.dre-card>header{
display:flex;
justify-content:space-between;
background:var(--paper);
padding:20px 24px;
border-bottom:1px solid var(--line)
}
.dre-card>header p{
font-size:9px;
letter-spacing:.1em;
color:var(--muted)
}
.result{
text-align:right
}
.result span{
display:block;
font-size:9px;
color:var(--muted)
}
.result strong{
font:700 26px Georgia;
color:var(--primary)
}
.dre-cols{
display:grid;
grid-template-columns:1fr 1fr
}
.dre-cols>section{
padding:20px 24px
}
.dre-cols>section+section{
border-left:1px solid var(--line)
}
.dre-cols h3{
font-size:11px;
text-transform:uppercase;
color:var(--muted)
}
.dre-cols section>div,.dre-cols footer{
display:flex;
justify-content:space-between;
padding:8px 0;
font-size:11px
}
.dre-cols footer{
border-top:1px solid var(--line);
margin-top:8px
}
.dre-note{
background:var(--primary-soft);
padding:10px 24px;
color:var(--primary);
font-size:10px;
font-weight:700
}
.dre-comparison table{
min-width:720px
}
.dre-comparison th,
.dre-comparison td{
padding:12px 16px
}
.dre-comparison tbody th{
font-weight:600;
text-align:left
}
.dre-comparison .dre-month{
min-width:150px;
text-align:right
}
.dre-month small{
display:block;
margin-top:4px;
color:var(--primary);
font-size:8px;
letter-spacing:.08em;
text-transform:uppercase
}
.dre-comparison .number{
font-variant-numeric:tabular-nums;
text-align:right
}
.dre-comparison .zero{
color:var(--muted)
}
.dre-comparison .dre-section th{
background:var(--paper);
color:var(--muted);
font-size:9px;
letter-spacing:.12em
}
.dre-comparison .dre-total th,
.dre-comparison .dre-total td{
border-top:2px solid var(--line)
}
.dre-comparison .dre-result th,
.dre-comparison .dre-result td{
background:var(--primary-soft);
border-top:3px double var(--primary);
color:var(--primary);
font-size:14px
}
.dre-comparison .negative{
color:var(--red)
}
.report-tabs{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px;
margin:16px 0
}
.report-tab{
display:flex;
flex-direction:column;
gap:3px;
padding:14px 16px;
border:1px solid var(--line);
border-radius:var(--radius);
background:var(--surface);
color:var(--ink);
text-decoration:none
}
.report-tab span{
color:var(--muted);
font-size:11px
}
.report-tab.active{
border-color:var(--primary);
background:var(--primary-soft);
color:var(--primary)
}
.property-statement-head{
align-items:flex-start
}
.property-statement-head>div>p:last-child{
margin-bottom:0;
color:var(--muted)
}
.property-statement-summary{
display:flex;
gap:20px;
margin:0
}
.property-statement-summary div{
text-align:right
}
.property-statement-summary dt{
color:var(--muted);
font-size:9px;
letter-spacing:.08em;
text-transform:uppercase
}
.property-statement-summary dd{
margin:3px 0 0;
font-weight:800
}
.property-net th,
.property-net td{
border-top:2px solid var(--primary);
font-size:13px;
font-weight:800
}
.property-net th{
text-align:right
}
.property-no-movements{
margin:8px 0 0;
color:var(--muted);
font-size:10px
}
.print-page{
display:block;
background:var(--print-canvas);
padding:25px
}
.print-toolbar{
position:fixed;
right:25px;
top:25px
}
.statement{
width:210mm;
min-height:297mm;
margin:auto;
background:var(--surface);
padding:18mm;
box-shadow:var(--shadow-print)
}
.statement-head{
display:flex;
justify-content:space-between;
border-bottom:3px solid var(--primary);
padding-bottom:16px
}
.statement-head>div:first-child span{
font:800 25px Georgia;
color:var(--primary)
}
.statement-head small{
display:block;
letter-spacing:.18em;
font-size:8px
}
.statement-head p{
margin:0;
color:var(--muted);
font-size:10px
}
.statement-head h1{
font-size:25px
}
.owner-summary{
display:grid;
grid-template-columns:2fr 1fr 1fr;
background:var(--primary-soft);
padding:14px;
margin:18px 0
}
.owner-summary span{
display:block;
font-size:8px;
text-transform:uppercase;
color:var(--muted)
}
.owner-summary b{
font-size:12px
}
.statement-property{
margin:20px 0;
break-inside:avoid
}
.statement-property>header{
display:flex;
justify-content:space-between;
align-items:end
}
.statement-property>header span{
font-size:10px;
color:var(--muted)
}
.property-statement-print>header>div:first-child span{
display:block;
margin-top:3px
}
.property-print-summary{
display:flex;
gap:14px
}
.statement-note{
font-size:9px;
background:var(--amber-soft);
padding:8px
}
.statement-total{
margin-left:auto;
width:48%;
border-top:2px solid var(--primary);
padding-top:12px
}
.statement-total dl{
display:grid;
grid-template-columns:1fr auto;
font-size:11px;
gap:7px
}
.statement-total dt:last-of-type,.statement-total dd:last-of-type{
font-size:15px;
font-weight:800;
color:var(--primary)
}
.statement>footer{
border-top:1px solid var(--line);
margin-top:35px;
padding-top:12px;
font-size:8px;
color:var(--muted)
}
@media(max-width:1100px){
body{
grid-template-columns:176px 1fr
}
.brand{
padding-left:6px;
padding-right:6px
}
.brand strong{
font-size:15px
}
.sidebar-nav a{
font-size:12px;
padding:7px
}
.nav-group summary{
font-size:8px
}
.metric-grid{
grid-template-columns:1fr 1fr
}
.closing-grid{
grid-template-columns:1fr 1fr
}
.drawer[open]>form{
width:calc(100vw - 120px)
}
.classification-drawer[open]>.classification-grid{
left:98px;
grid-template-columns:1fr
}
.account-balance-grid{
grid-template-columns:repeat(2,minmax(0,1fr))
}
.statement-columns,
.statement-row{
grid-template-columns:90px minmax(180px,1fr) 115px minmax(210px,.8fr)
}
.vacancy-directory{
display:block;
min-width:0
}
.vacancy-directory thead{
display:none
}
.vacancy-directory>tbody.directory-row{
display:block;
border:1px solid var(--line);
border-radius:9px;
margin-bottom:12px;
overflow:hidden
}
.vacancy-info-row{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr))
}
.vacancy-info-row td,
.vacancy-info-row td:first-child{
display:block;
height:auto;
min-width:0;
padding:12px
}
.vacancy-info-row .vacancy-property,
.vacancy-info-row .vacancy-observation{
grid-column:span 2;
max-width:none
}
.vacancy-column-label{
display:block;
color:var(--muted);
font-size:9px;
font-weight:800;
margin-bottom:4px;
text-transform:uppercase
}
.vacancy-action-row,
.vacancy-action-row td{
display:block;
width:100%
}
.vacancy-directory>tbody.directory-row+tbody.directory-row .vacancy-info-row td{
border-top:0
}
.vacancy-observation-entry{
flex-basis:100%
}

}
@media(max-width:720px){
body{
display:block
}
aside{
position:static;
height:auto;
padding:10px
}
.sidebar-nav{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px;
overflow:visible
}
.brand,.aside-foot{
display:none
}
.sidebar-nav a{
font-size:12px;
white-space:normal
}
.nav-group{
align-content:start
}
main>header{
padding:18px;
height:auto
}
.content{
padding:18px
}
.toolbar{
align-items:stretch;
flex-direction:column
}
.toolbar>div{
flex-wrap:wrap;
min-width:0;
width:100%
}
.toolbar .filters{
display:grid;
flex:1 1 100%;
grid-template-columns:minmax(0,1fr);
width:100%
}
.metric-grid,.two-col,.detail-grid,.closing-grid,.bank-columns,.dre-cols{
grid-template-columns:1fr
}
.report-tabs{
grid-template-columns:1fr
}
.property-statement-head{
align-items:stretch;
flex-direction:column
}
.property-statement-summary{
justify-content:flex-start
}
.property-statement-summary div{
text-align:left
}
.bank-account-head,
.statement-toolbar,
.balance-check{
align-items:stretch;
flex-direction:column
}
.account-selector{
align-items:stretch
}
.account-selector label{
min-width:0;
flex:1
}
.account-balance-grid{
grid-template-columns:1fr
}
.statement-columns{
display:none
}
.statement-row{
grid-template-columns:1fr auto
}
.statement-row>time{
grid-column:1
}
.statement-description{
grid-column:1/-1
}
.statement-value{
grid-column:2;
grid-row:1;
align-self:start
}
.statement-status{
grid-column:1/-1
}
.statement-filters{
overflow:auto
}
.header-actions{
display:none
}
.drawer[open]>form{
left:12px;
right:12px;
top:80px;
width:auto
}
.classification-drawer[open]>.classification-grid{
left:12px;
right:12px;
top:60px;
grid-template-columns:1fr
}
.form-grid{
grid-template-columns:1fr
}
.form-grid>*{
grid-column:1
}
.table-wrap{
overflow:auto
}
.vacancy-info-row{
grid-template-columns:repeat(2,minmax(0,1fr))
}
.vacancy-info-row .vacancy-property,
.vacancy-info-row .vacancy-observation{
grid-column:1/-1
}
.vacancy-row-actions form{
flex-basis:100%
}
.vacancy-row-actions button,
.vacancy-row-actions .button{
flex:1 1 155px;
text-align:center
}
.statement{
width:100%;
padding:20px
}
.print-page{
padding:0
}

}
@media(max-width:430px){
.sidebar-nav{
grid-template-columns:1fr
}
}
@media print{
.print-toolbar{
display:none
}
.print-page{
background:var(--surface);
padding:0
}
.statement{
box-shadow:none;
margin:0;
width:auto;
min-height:0;
padding:10mm
}
@page{
size:A4;
margin:0
}

}