/* Layout e componentes do Salarify v2. */
[hidden] { display: none !important; }
#mainScreen:not([hidden]) { display: block; }
body { overflow-x: clip; }
.brand { display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--primary-color);font-size:23px;font-weight:800; }
.workspace { max-width:1460px;margin:auto;display:grid;grid-template-columns:180px minmax(0,1fr);gap:30px;padding:12px 28px 40px;position:relative;z-index:1; }
.app-nav { display:flex;flex-direction:column;gap:8px;position:sticky;top:106px;align-self:start; }
.app-nav button { border:0;border-radius:12px;background:transparent;color:var(--text-secondary);padding:13px 16px;font:600 14px inherit;text-align:left;cursor:pointer;min-height:44px; }
.app-nav button:hover { background:var(--bg-secondary); }
.app-nav button.active { background:var(--grad-primary);color:white;box-shadow:var(--shadow); }
.app-content { min-width:0; }
.page-heading { display:flex;align-items:center;justify-content:space-between;gap:20px;margin:4px 0 25px;flex-wrap:wrap; }
.page-heading h1 { font-size:30px;letter-spacing:-1px; }
.eyebrow { font-size:10px;letter-spacing:1.6px;font-weight:700;color:var(--text-secondary); }
.period-picker { display:flex;gap:7px;align-items:center;flex-wrap:wrap; }
.period-picker input,#reportYear { border:1px solid var(--border-color);border-radius:10px;padding:10px;background:var(--bg-card);color:var(--text-primary);font:inherit;min-height:44px;max-width:180px; }
.period-picker .icon-btn { font-size:24px; }
.summary-cards { grid-template-columns:repeat(4,minmax(0,1fr)); }
.card-value { font-size:clamp(18px,2vw,25px);overflow-wrap:anywhere; }
.card-note { color:var(--text-secondary);font-size:11px;margin-top:8px; }
.two-columns { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start; }
.help { font-size:13px;color:var(--text-secondary);margin:8px 0 16px;line-height:1.6; }
.centered { text-align:center; }
.reserve-totals { display:flex;flex-wrap:wrap;gap:20px;margin:20px 0; }
.reserve-totals span { display:block;color:var(--text-secondary);font-size:12px; }
.reserve-totals strong { display:block;font-size:24px; }
.transaction-item { flex-wrap:wrap; }
.transaction-info { flex:1 1 170px; }
.transaction-date { overflow-wrap:anywhere; }
.amount { white-space:nowrap;font-size:16px; }
.positive { color:var(--success-color); }
.negative { color:var(--danger-color) !important; }
.status { display:inline-block;border-radius:8px;padding:2px 7px;margin-top:4px;font-size:10px;font-weight:700; }
.status.pending { background:rgba(245,158,11,.12);color:var(--warning-color); }
.status.confirmed { background:rgba(16,185,129,.12);color:var(--success-color); }
.empty-message { padding:25px 8px;color:var(--text-secondary);font-size:14px;text-align:center; }
.asset-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px; }
.asset-value { font-size:30px;letter-spacing:-1px; }
.asset-details { margin:18px 0; }
.asset-details div { display:flex;justify-content:space-between;gap:10px;margin:9px 0;font-size:13px; }
.asset-details dt { color:var(--text-secondary); }
.asset-details dd { font-weight:600; }
.section-heading,.dialog-heading { display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;flex-wrap:wrap; }
.section-heading h2 { font-size:19px;overflow-wrap:anywhere; }
.section-heading .section-title { margin-bottom:0; }
.pagination { display:flex;gap:14px;align-items:center;justify-content:center;margin-top:20px;font-size:12px;flex-wrap:wrap; }
.category-chart { display:flex;flex-direction:column;gap:18px; }
.bar-row { display:grid;grid-template-columns:minmax(90px,1fr) 2fr auto;align-items:center;gap:14px;font-size:13px; }
.bar-row span { overflow-wrap:anywhere; }
progress { width:100%;height:12px;accent-color:var(--primary-color); }
.table-scroll { overflow-x:auto; }
table { border-collapse:collapse;width:100%;font-size:13px; }
th,td { padding:13px 12px;text-align:right;border-bottom:1px solid var(--border-color);white-space:nowrap; }
th:first-child { text-align:left;text-transform:capitalize; }
thead { color:var(--text-secondary); }
tfoot { font-weight:700; }
.button-row { display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:20px; }
.button-row .btn { width:auto; }
.align-end { display:flex;align-items:flex-end; }
.danger-zone { border-color:rgba(244,63,94,.3); }
.danger-zone::before { background:var(--grad-danger); }
.app-dialog { margin:auto;border:1px solid var(--border-color);border-radius:20px;background:var(--bg-card);color:var(--text-primary);max-width:540px;width:calc(100% - 28px);max-height:90dvh;padding:24px;box-shadow:var(--shadow-xl);overflow-y:auto; }
.app-dialog::backdrop { background:rgba(8,5,26,.65);backdrop-filter:blur(5px); }
.dialog-heading h2 { font-size:20px; }
.connection-banner { background:#78350f;color:white;padding:10px 18px;text-align:center;font-size:13px;position:relative;z-index:101; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
button:disabled { opacity:.55;cursor:wait;transform:none!important; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid var(--primary-color);outline-offset:3px; }
[data-theme="dark"] { color-scheme:dark; }
.category-item { gap:10px; }
.category-list { grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.login-card .logo-section img { margin-bottom:8px; }
.login-card .logo-section h1 { font-size:32px; }
.calculator-keypad { max-width:360px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px; }
.calculator-keypad button { min-height:44px;border:1px solid var(--border-color);border-radius:9px;background:var(--bg-secondary);color:var(--text-primary);font-weight:650; }
.calculator-keypad button[type="submit"] { background:var(--grad-primary);color:white; }
@media(max-width:1100px) { .summary-cards{grid-template-columns:repeat(2,minmax(0,1fr));}.workspace{grid-template-columns:150px minmax(0,1fr);gap:18px;padding:8px 18px 30px;}.two-columns{grid-template-columns:1fr;} }
@media(max-width:768px) {
 header{margin-bottom:10px;}.header-content{padding:0 16px;}.brand{font-size:20px;}.header-user{display:none;}
 .workspace{display:block;padding:8px 14px 30px;}.app-nav{position:static;flex-direction:row;overflow-x:auto;margin-bottom:20px;gap:4px;padding-bottom:8px;}.app-nav button{white-space:nowrap;text-align:center;font-size:12px;padding:10px 12px;}
 .page-heading{gap:12px;}.page-heading h1{font-size:26px;}.period-picker{width:100%;}.period-picker input{flex:1;max-width:none;min-width:100px;}
 .two-columns{grid-template-columns:1fr;}.bar-row{grid-template-columns:1fr 1fr auto;gap:8px;font-size:11px;}.card-value{font-size:21px;}
 .form-row{grid-template-columns:1fr;}.transaction-item{gap:9px;}.transaction-info{flex:1 1 100%;}.amount{flex:1;}
 .app-dialog{padding:18px;}.reserve-totals strong{font-size:21px;}
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;} }
