/* ALUMIA · Identidade 2.0
   Preto fosco, branco marfim e dourado antigo.
   Os dados financeiros e as regras da versão anterior não foram alterados. */
:root {
  --ink: #F4F0E8;
  --muted: #ABA49A;
  --line: #312C25;
  --page: #0D0C0B;
  --navy: #080808;
  --navy2: #161411;
  --teal: #D5B46E;
  --teal-light: #2A241B;
  --red: #DE8B83;
  --orange: #D9B978;
  --gold: #D2AD65;
  --gold-bright: #E8CA8B;
  --cream: #F4F0E8;
  --surface: #171614;
  --surface-alt: #1E1B17;
  --shadow: 0 14px 45px rgba(0,0,0,.20);
}
html { color-scheme: dark; }
body {
  background: #0D0C0B;
  color: var(--ink);
  font-family: 'DM Sans', -apple-system, system-ui, sans-serif;
}
button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid var(--gold-bright);
  outline-offset: 3px;
}
a {color: var(--gold-bright)}
.sidebar {
  width: 254px;
  background: linear-gradient(178deg,#0B0A09 0%,#10100E 70%,#0B0A09 100%);
  border-right: 1px solid #3A3022;
  padding: 29px 15px 24px;
}
.workspace {margin-left:254px;width:calc(100% - 254px)}
.brand {gap: 12px;margin:0 9px 51px;min-height: 58px}
.brand-symbol {width:51px;height:51px;border:0;border-radius:14px;background:#201A13;padding:2px;overflow:hidden;box-shadow: 0 0 0 1px #624C2C}
.brand-symbol img {width:100%;height:100%;object-fit:contain;display:block}
.brand b {font-family:Georgia,'Times New Roman',serif;font-size:25px;letter-spacing:2.3px;font-weight:500;color:#F9F4E9;line-height:1.25}
.brand small {color:#BB985A;letter-spacing:1.6px;font-size:8px;margin-top:6px;display:block}
.sidebar-label {color:#977C53;font-size:10px;letter-spacing:1.8px;font-weight:700;margin-left:21px}
.sidebar-nav {gap:7px}
.nav-item {color:#BEB8AD;font-weight:600;font-size:12px;border-radius:9px;padding:13px 15px;position:relative}
.nav-item:hover {color:#FBF4E6;background:#211E19}
.nav-item.active {color:#FFF7E9;background:linear-gradient(90deg,#322719,#252019);border:1px solid #6B502A;padding:12px 14px}
.nav-item.active:before {content:'';position:absolute;left:-1px;top:10px;bottom:10px;width:2px;background:#E1BA70;border-radius:8px}
.nav-item.active .nav-ico {color:var(--gold-bright)}
.nav-ico {color:#AF9B7C}
.side-bottom {background:linear-gradient(155deg,#1C1914,#141312);border:1px solid #4D3B24;border-radius:12px;padding:18px 17px}
.side-bottom-icon {width:61px;height:35px;overflow:hidden}
.side-bottom-icon img {width:62px;height:40px;display:block}
.side-bottom p {font-family:Georgia,'Times New Roman',serif;font-size:16px;line-height:1.4;color:#F2E8D4;margin:12px 0 23px}
.side-bottom span {color:#AC8F60;font-size:9px;letter-spacing:1.7px}
.topbar {background:rgba(18,17,15,.97);height:79px;border-bottom:1px solid #393024;padding:0 38px}
.breadcrumb {color:#AE986E;font-size:10px;letter-spacing:1.6px;gap:11px}
.breadcrumb .top-brand {display:flex;align-items:center;gap:6px;color:#DEBD7D;font-weight:700;letter-spacing:2px}
.breadcrumb .top-brand img {width:26px;height:23px;object-fit:contain}
.breadcrumb b {color:#EDE5D5;font-size:12px;font-weight:600}
.slash {color:#736047}
.status-chip {border:1px solid #453C2F;color:#C4B6A3;background:#1C1A17;padding:9px 12px}
.status-chip i {background:#CFA65B}
.status-chip.synced i {background:#9DBB8E}
.status-chip.error i {background:#DD8A80}
.btn {border-radius:9px;font-weight:700;letter-spacing:.1px}
.btn-primary {background:linear-gradient(110deg,#E0C07F,#BC8E45);color:#15110D;box-shadow:0 4px 20px #B5853230}
.btn-primary:hover {background:linear-gradient(115deg,#EFCE8E,#CBA058)}
.btn-secondary {color:#ECD8B1;background:#2A251E;border:1px solid #51412B}
.btn-secondary:hover {background:#393025}
.btn-ghost {color:#D6C6AD;border:1px solid #4C4135;background:#1E1B17}
.btn-danger {background:#34201F;color:#F2A69B}
.page {max-width:1540px;padding:34px 39px 95px}
.page-intro {margin-bottom:29px;position:relative;z-index:1}
.page-intro:after {content:'';position:absolute;right:5%;top:-19px;width:340px;height:120px;background:radial-gradient(ellipse at 60% 0%,rgba(193,139,55,.16),transparent 72%);pointer-events:none;z-index:-1}
.eyebrow {color:#C6A15C;letter-spacing:2.5px;font-size:10px;font-weight:700;margin-bottom:12px}
h1,h2,h3 {color:#F3ECE0}
.page-title {font-family:Georgia,'Times New Roman',serif;font-size:37px;font-weight:500;letter-spacing:-.6px;line-height:1.13}
.subheading {color:#ABA49A;font-size:12px;letter-spacing:.12px;margin-top:11px}
.panel {background:linear-gradient(145deg,#1A1916,#141311);border:1px solid #383026;border-radius:14px;box-shadow:var(--shadow);padding:25px}
.panel-title {font-size:15px;font-weight:700;color:#F6F0E4;letter-spacing:-.18px}
.panel-subtitle {color:#A39B8E;font-size:11px;line-height:1.5}
.card-link {color:#D5AF69;font-weight:700}
.card-link:hover {color:#F3CE88}
.balance-grid {gap:17px;margin-bottom:19px}
.balance-card {min-height:202px;border-radius:15px;padding:27px 29px;border:1px solid #6B5232;box-shadow:inset 0 0 28px #D8B26905, 0 16px 35px #00000029}
.balance-card.euro {background:linear-gradient(120deg,#30261A 0%,#1A1713 52%,#151413 100%)}
.balance-card.real {background:linear-gradient(120deg,#26211A 0%,#171614 54%,#131312 100%);border-color:#56462F}
.balance-card:after {border:1px solid #CCA86026;box-shadow:0 0 0 46px #C59D4712,0 0 0 92px #B98B2D08;width:250px;height:250px;top:-145px;right:-23px}
.balance-card:before {content:'';position:absolute;height:1px;left:28px;right:28px;top:0;background:linear-gradient(90deg,transparent,#DCBD75,transparent);opacity:.72}
.balance-label {color:#DCCFB7;font-weight:500}
.flag-coin {background:#58432A;color:#F3D28E;border:1px solid #765C38;font-size:13px;font-weight:700;width:30px;height:30px}
.balance-value {font-family:Georgia,'Times New Roman',serif;font-weight:500;font-size:40px;letter-spacing:-.4px;color:#FFF7E9;margin-top:26px}
.balance-foot {color:#AFA496;margin-top:19px;font-size:10px}
.balance-foot strong {color:#D7BB86;font-weight:600}
.summary-grid,.layout-bottom {gap:19px}
.stat-row {gap:11px}
.mini-stat,.period-analysis .mini-stat {background:#211F1B;border:1px solid #3A3228;border-radius:10px;padding:16px 13px}
.stat-label {color:#C1B5A2;font-weight:600;font-size:11px}
.stat-label .dot {background:#D7B46E}
.stat-label .dot.red {background:#C9847E}
.stat-label .dot.blue {background:#879EB2}
.mini-stat .val {font-family:Georgia,'Times New Roman',serif;color:#FBF4E8;font-weight:600;font-size:21px;letter-spacing:-.35px}
.thin-divider {border-top:1px solid #3A332A}
.segment {background:#211E1A;border:1px solid #463C2D}
.segment button {color:#A49B8C}
.segment button.active {color:#24190C;background:#D6B776;box-shadow:none}
.donut {box-shadow:0 0 0 1px #41372B;background:conic-gradient(#39352F 0 100%)}
.donut-hole {background:#191714;border:1px solid #393127}
.donut-hole span {color:#B0A494}
.donut-hole b {color:#F7EDDB;font-family:Georgia,'Times New Roman',serif;font-size:19px;font-weight:500}
.legend-row .name {color:#C4B9A7}
.legend-row b {color:#F0DBB8}
.legend-row .legend-swatch {border-radius:50%}
.activity-table th {color:#AE9369;border-bottom-color:#473A29;font-size:9px}
.activity-table td {color:#C2B8AA;border-bottom-color:#332C24}
.activity-table .amount,.activity-table .item-title {color:#F2EBDD}
.activity-table .amount.positive {color:#A2BE9B}
.activity-table .amount.negative {color:#E8A197}
.activity-table .item-note {color:#94897A}
.cat-ico {background:#30291E;border:1px solid #4A3923;color:#F1D08C}
.category-pill {background:#302920;color:#DDC49A;border:1px solid #493A27}
.rate-badge {background:#30291E;border:1px solid #57452D;color:#EAC681}
.rate-line {border-bottom:1px solid #393027}
.rate-line span {color:#BDB1A1}
.rate-line b {color:#F6EBDC;font-weight:700}
.empty {color:#A59A88}
.empty .symbol {color:#D4B477}
.empty b {color:#EADAC0}
.empty p {color:#9D9387}
.muted,.foot-note,.pwa-tip {color:#A89E90}
.period-select,.field select,.field input,.field textarea {background:#24211C;border:1px solid #514331;color:#F2E7D4;border-radius:9px}
.period-select:focus,.field select:focus,.field input:focus,.field textarea:focus {border-color:#D3B370;box-shadow:0 0 0 3px #D6B67322}
select option {background:#25221E;color:#FAEFE0}
input::placeholder, textarea::placeholder {color:#8D8276;opacity:1}
.field label {color:#CBBBA3;font-weight:600}
.field-hint {color:#AEA292}
.icon-button {background:#2A251F;border:1px solid #52422E;color:#D6BB88}
.icon-button:hover {color:#FFEAC1;border-color:#BC9556}
.tag {background:#2C261E;border:1px solid #4A3C29;color:#D9BD8D}
.notice {background:#292219;border-color:#604B2E;color:#D9C1A1}
.notice.warn {background:#29231C;border-color:#665035;color:#E5C897}
.message {background:#24211D;border-color:#493D30;color:#D1C6B9}
.shortcut-box,.chips,.chip {background:#28231E;color:#D0B88F}
.shortcut-box span {color:#B7A895}
.shortcut-box b {color:#F1DFBB}
.modal-wrap {background:#000000C4;backdrop-filter:blur(7px)}
.modal {background:linear-gradient(150deg,#211D18,#151412);border:1px solid #654F2F;color:#F5F0E8;box-shadow:0 24px 100px #000000A8}
.modal-header h2 {font-family:Georgia,'Times New Roman',serif;color:#F7E9D0;font-size:26px;font-weight:500;letter-spacing:0}
.modal-header p {color:#AFA190}
.close {background:#3A3025;color:#E6D0A7}
.toggle-row button {background:#24201A;color:#BEB09C;border:1px solid #4E4030}
.toggle-row button.active {background:#433323;color:#F9DBA1;border-color:#B89254}
.big-number {font-family:Georgia,'Times New Roman',serif;color:#F2DFB8;font-weight:500}
.toast {background:#322616;border:1px solid #98713D;color:#F5E4C4}
@media(max-width:1260px) {
  .page {padding:31px 28px 95px}
  .topbar {padding:0 28px}
}
@media(max-width:830px) {
  .sidebar {width:202px}
  .workspace {margin-left:202px;width:calc(100% - 202px)}
  .brand {margin-left:2px;gap:7px}
  .brand b {font-size:21px;letter-spacing:1.2px}
  .brand small {font-size:7px;letter-spacing:1px}
  .page-title {font-size:32px}
  .balance-value {font-size:31px}
}
@media(max-width:680px) {
  .workspace {margin:0;width:100%}
  .topbar {height:67px;padding:0 17px}
  .breadcrumb .top-brand {display:flex;letter-spacing:1.6px}
  .breadcrumb .top-brand img {width:24px;height:20px}
  .breadcrumb b {font-size:10px;color:#BEB5A8}
  .slash {display:inline}
  .status-chip {font-size:9px;padding:7px 9px}
  .page {padding:29px 16px 115px}
  .page-intro {gap:10px}
  .page-title {font-size:29px}
  .page-intro .period-select {font-size:10px;padding:8px 7px;max-width:130px}
  .balance-grid {gap:9px}
  .balance-card {padding:17px 13px;min-height:170px}
  .balance-label {font-size:10px;gap:5px}
  .flag-coin {width:25px;height:25px;font-size:11px}
  .balance-value {font-size:23px;letter-spacing:0;margin-top:28px}
  .balance-foot {font-size:9px;margin-top:15px}
  .panel {padding:19px 16px}
  .mini-stat {padding:12px 8px}
  .mini-stat .val {font-size:16px}
  .donut-hole b {font-size:15px}
  .mobile-nav {background:#12110F;border-top:1px solid #56442A;box-shadow:0 -10px 30px #00000080}
  .mobile-nav button {color:#AFA396}
  .mobile-nav button.active {color:#E8BE75}
  .mobile-nav .mobile-add {background:linear-gradient(145deg,#ECC77F,#B8843F);color:#20160A;box-shadow:0 6px 18px #CCA15638}
  .modal {background:#191714;border:1px solid #493B29;border-bottom:0}
  .donut {width:152px;height:152px}
}
@media(max-width:390px){
  .balance-card {min-height:153px}
  .balance-value {font-size:20px}
  .donut {height:122px;width:122px}
  .donut-hole b {font-size:12px}
}
/* Acabamentos de usabilidade no iPhone */
@media(max-width:680px) {
  .breadcrumb span.top-brand:first-child {display:flex;align-items:center}
  .panel-head {gap:8px}
  .segment button {padding:7px 8px;white-space:nowrap;font-size:10px}
  .mobile-nav {padding-bottom:max(6px,env(safe-area-inset-bottom))}
}

/* Correções iPhone (safe areas, altura dinâmica, zoom em campos) · v2.3 */
html { background:#0D0C0B; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
html, body { overscroll-behavior:none; }
.app-shell { min-height:100vh; min-height:100dvh; }
.sidebar { height:100vh; height:100dvh; }
@media(max-width:680px) {
  .topbar {
    height:auto;
    min-height:calc(67px + env(safe-area-inset-top));
    padding-top:env(safe-area-inset-top);
    padding-left:max(17px, env(safe-area-inset-left));
    padding-right:max(17px, env(safe-area-inset-right));
  }
  .page { padding-bottom:calc(115px + env(safe-area-inset-bottom)); }
  .mobile-nav {
    height:auto;
    min-height:calc(70px + env(safe-area-inset-bottom));
    padding:6px max(12px, env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-right));
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    will-change:transform;
  }
  /* Evita o zoom automático do Safari ao tocar em campos (< 16px) */
  input, select, textarea,
  .field input, .field select, .field textarea,
  .auth-card input,
  .page-intro .period-select { font-size:16px; }
  .page-intro .period-select { padding:7px 6px; }
  .modal {
    max-height:94vh;
    max-height:94dvh;
    padding-bottom:calc(25px + env(safe-area-inset-bottom));
  }
  .toast {
    left:16px;
    right:16px;
    max-width:none;
    bottom:calc(92px + env(safe-area-inset-bottom));
  }
}

/* Ícones uniformes do menu inferior (evita emoji colorido no iPhone) */
.mobile-nav button .nav-svg{display:flex;align-items:center;justify-content:center;width:24px;height:24px;font-size:0;line-height:0}
.mobile-nav button .nav-svg svg{width:22px;height:22px;display:block}

/* Alumia 2.4: adapta seis itens no menu inferior preservando as melhorias do iPhone. */
@media(max-width:680px){
  .mobile-nav{justify-content:space-between;gap:0}
  .mobile-nav button{flex:1 1 0;min-width:0;padding:6px 1px;font-size:9px}
  .mobile-nav button .nav-svg{width:22px;height:24px}
  .mobile-nav .mobile-add{flex:0 0 45px;min-width:45px;max-width:45px}
  .mobile-nav .mobile-add span{font-size:27px}
}
@media(max-width:350px){.mobile-nav button{font-size:8px}.mobile-nav{padding-left:5px;padding-right:5px}}


/* Alumia 2.4.1 · correção do formulário em iOS/Safari
   Os controles de Data e Categoria não disputam a largura da mesma linha.
   Mantém intactos os estilos de identidade visual e navegação existentes. */
@media (max-width:680px) {
  .modal-wrap .modal {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .modal #recordForm .form-grid {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 14px;
    width: 100%;
  }
  .modal #recordForm .form-grid > .field,
  .modal #recordForm .form-grid > .full {
    grid-column: 1 / -1;
    min-width: 0;
    max-width: 100%;
  }
  .modal #recordForm .form-grid .field input,
  .modal #recordForm .form-grid .field select,
  .modal #recordForm .form-grid .field textarea {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 16px;
  }
  .modal #recordForm .form-grid input[type="date"] {
    -webkit-appearance: auto;
    appearance: auto;
    min-height: 46px;
  }
}
