/* Finance module styles. Structural colors (--bg, --card, --line, --txt, --muted, --accent, --green, --red) and theme colors are inherited from the Avalone shell so the module follows the admin-configured light/dark palette and the user's theme mode (data-theme on or system preference). */ :root { --amber:#d29922; --btn-ghost-bg:#2d3543; --btn-ghost-txt:#eaf0f7; --btn-ghost-bd:#414b5c; } @media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){ --amber:#9a6700; --btn-ghost-bg:#e7ebf2; --btn-ghost-txt:#1a1d24; --btn-ghost-bd:#b9c2cf; } } :root[data-theme="light"]{ --amber:#9a6700; --btn-ghost-bg:#e7ebf2; --btn-ghost-txt:#1a1d24; --btn-ghost-bd:#b9c2cf; } :root[data-theme="dark"]{ --amber:#d29922; --btn-ghost-bg:#2d3543; --btn-ghost-txt:#eaf0f7; --btn-ghost-bd:#414b5c; } *{box-sizing:border-box;-webkit-tap-highlight-color:transparent} body{margin:0;background:var(--bg);color:var(--txt); font:16px/1.5 -apple-system,Segoe UI,Roboto,sans-serif} .wrap{max-width:560px;margin:0 auto;padding:16px 14px calc(150px + env(safe-area-inset-bottom))} h1{font-size:22px;font-weight:700;margin:6px 0 18px;letter-spacing:-.3px} /* shared structural widgets used by the finance app and admin dashboard */ .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0} .card{background:var(--card);border:1px solid var(--line);border-radius:14px; padding:16px;margin-bottom:14px} .card .label{color:var(--muted);font-size:12px} .card .val{font-size:20px;font-weight:600;margin-top:4px} section{background:var(--card);border:1px solid var(--line); border-radius:12px;padding:14px 16px;margin:14px 0} section h2{font-size:14px;color:var(--muted);margin:0 0 10px; text-transform:uppercase;letter-spacing:.04em} .row{display:flex;gap:8px} .bar{height:6px;background:var(--accent);border-radius:3px;margin-top:4px} .muted{color:var(--muted);font-size:13px} .small{font-size:13px;color:var(--muted)} .num{font-variant-numeric:tabular-nums} .pos{color:var(--green)} .neg{color:var(--red)} label{display:block;color:var(--muted);font-size:13px;margin:10px 0 4px} select,input[type=number],input[type=text],input[type=password],input[type=email],textarea{width:100%;padding:12px;font-size:16px; border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--txt);box-sizing:border-box} .btn{padding:12px 16px;border-radius:10px;border:none;font-size:16px;cursor:pointer} .btn-primary{background:var(--accent);color:#fff;width:100%} .btn-ghost{background:var(--btn-ghost-bg);color:var(--btn-ghost-txt);border:1px solid var(--btn-ghost-bd);font-weight:500} .btn-ghost:active{filter:brightness(1.15)} a.btn{display:inline-block;background:var(--accent);color:#fff; text-decoration:none;padding:10px 18px;border-radius:8px} /* канбан-индикатор проводки */ .kanban{display:flex;gap:6px;margin:12px 0;flex-wrap:nowrap} .kstep{flex:1 0 0;min-width:0;text-align:center;font-size:12px;color:var(--muted);padding:7px 4px; border-radius:8px;background:var(--bg);border:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .kstep.active{border-color:var(--amber);color:var(--amber)} .kstep.done{border-color:var(--green);color:var(--green)} /* журнал / списки */ .list-row{display:flex;justify-content:space-between;gap:8px;padding:9px 0; border-bottom:1px solid var(--line);align-items:center} .list-row:last-child{border-bottom:none} .list-row .num{white-space:nowrap;flex-shrink:0} .list-row .small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .list-row button{margin-left:6px} .list-row > span:last-child{display:flex;align-items:center;gap:6px;flex-shrink:0;white-space:nowrap} /* отменённая запись в журнале: блёкло + перечёркнутая сумма */ .list-row.cancelled{opacity:.5} .list-row.cancelled .num{text-decoration:line-through} /* нижнее таб-меню */ .app-tabs{position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom)); transform:translateX(-50%);width:calc(100% - 32px);max-width:560px;display:flex; gap:6px;background:var(--card);border:1px solid var(--line);border-radius:14px; padding:6px;margin:0;z-index:50;box-shadow:0 4px 16px rgba(0,0,0,.3)} .tab{flex:1;padding:6px 0;min-height:48px;text-align:center;color:var(--muted); font-size:11px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;transition:color .15s,background .15s;border-radius:12px;margin:0 4px} .tab.active{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)} .tab-icon{font-size:22px} .toast{position:fixed;top:calc(var(--header-h) + 14px);left:50%;transform:translateX(-50%);background:var(--card); border:1px solid var(--green);border-radius:10px;padding:10px 16px;display:none;z-index:110} .hidden{display:none} .del{color:var(--red);background:none;border:none;font-size:18px;cursor:pointer} .acc-switcher-head{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:4px 0} .acc-switcher-login{font-size:18px;font-weight:600} .acc-switcher-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 0;border-bottom:1px solid var(--line)} .acc-switcher-item:last-child{border-bottom:none} .acc-switcher-item .login{font-weight:500} .acc-switcher-item .badge{font-size:11px;color:var(--accent);border:1px solid var(--accent);border-radius:8px;padding:1px 6px} .chip{background:var(--card);border:1px solid var(--line);color:var(--muted); border-radius:16px;padding:7px 12px;font-size:13px;cursor:pointer} .chip-on{background:var(--accent);border-color:var(--accent);color:#fff} /* модал-форма операции */ .overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:110;display:none; align-items:flex-end;justify-content:center} .overlay.show{display:flex} .sheet{background:var(--bg);width:100%;max-width:560px;max-height:92vh;overflow:auto; border-radius:18px 18px 0 0;padding:14px 14px calc(20px + env(safe-area-inset-bottom)); border:1px solid var(--line)} .sheet-footer{position:sticky;bottom:0;background:var(--bg);padding:8px 0;margin-top:8px;} .sheet-grip{width:40px;height:4px;background:var(--line);border-radius:2px;margin:2px auto 12px} .sheet-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px} .sheet-head .x{background:none;border:none;color:var(--muted);font-size:24px;cursor:pointer;min-width:44px;min-height:44px;padding:10px;margin:-10px -10px -10px 0;display:flex;align-items:center;justify-content:center} .open-form{font-size:17px;padding:16px;text-align:center} /* компактная форма операции */ .entry-sheet .sheet-head{margin-bottom:4px} .entry-sheet .kanban{margin:8px 0} .entry-sheet .kstep{padding:5px 2px;font-size:11px} .entry-sheet label{margin:6px 0 2px;font-size:12px} .entry-sheet select, .entry-sheet input[type=number], .entry-sheet input[type=text], .entry-sheet input[type=password], .entry-sheet input[type=email], .entry-sheet input[type=datetime-local], .entry-sheet textarea{padding:6px 8px;font-size:15px;min-height:32px;border-radius:8px} .entry-sheet .btn{padding:8px 12px;font-size:14px;min-height:34px;border-radius:8px} .entry-sheet .amount-row{align-items:center} .entry-sheet .amount-input{flex:1;min-width:0;height:auto;min-height:34px;padding:6px 8px;font-size:15px;line-height:1.2} .entry-sheet .amount-cur{flex:0 0 auto;width:auto;min-height:34px} .entry-sheet .amount-cur-toggle{flex:0 0 auto;padding:0 10px;min-height:34px} .entry-sheet #remark{min-height:32px} .entry-sheet .convert-btn{flex:0 0 auto;font-size:13px;padding:0 10px;min-height:34px;line-height:1;border-radius:8px} .entry-sheet #occurred-block input{margin-top:0} .entry-sheet .sheet-footer{padding:6px 0;margin-top:6px} .entry-sheet .sheet-footer .btn{min-height:38px} /* спиннер на кнопке */ .btn[disabled]{opacity:.6;cursor:default} .spin{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.4); border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;vertical-align:-3px} @keyframes spin{to{transform:rotate(360deg)}} /* inline-ошибка поля */ .field-err{border-color:var(--red)!important} .err-msg{color:var(--red);font-size:13px;margin:4px 0 0;display:none} .err-msg.show{display:block} /* FAB — плавающая кнопка добавления операции */ .fab{position:fixed;right:18px;bottom:calc(96px + env(safe-area-inset-bottom)); width:58px;height:58px;border-radius:50%;background:var(--accent);color:#fff; border:none;font-size:30px;line-height:58px;text-align:center;cursor:pointer; box-shadow:0 4px 16px rgba(0,0,0,.4);z-index:15;display:none} .fab.show{display:block} @media (min-width: 769px) { .fab{right:calc(50% - 560px/2 + 18px)} } /* аккордеон-секции на вкладке «Ещё» */ .acc{background:var(--card);border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden} .acc>summary{list-style:none;cursor:pointer;padding:16px;font-size:17px;font-weight:600; display:flex;justify-content:space-between;align-items:center} .acc>summary::-webkit-details-marker{display:none} .acc>summary::after{content:'⌄';color:var(--muted);transition:transform .2s} .acc[open]>summary::after{transform:rotate(180deg)} .acc>summary .badge{font-size:12px;color:var(--amber);font-weight:400} .acc-body{padding:0 16px 16px} .opt-disabled{opacity:.55;font-style:italic;color:var(--muted)} /* на мобильном FAB не должен закрывать контент карточек */ @media (max-width: 768px) { #w-journal.card, #w-balances.card, #page-ai .card { padding-right: 74px; } } /* Dashboard page overrides (public read-only dashboard) */ .finance-dashboard.wrap { max-width:760px; margin:0 auto; padding:20px 16px 60px; } .finance-dashboard h1 { font-size:20px; margin:8px 0 4px; } .finance-dashboard .row { display:flex; justify-content:space-between; padding:7px 0; border-bottom:1px solid var(--line); } .finance-dashboard .row:last-child { border-bottom:none; }