/* Shared finance dashboard; isolated from public website layout. */

/* Private finance dashboard — reported POS data, never a fictional bank balance. */
.app-finance{padding:0 3px 20px}
.app-finance-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:5px 2px 22px}
.app-finance h1{font:500 22px/1.5 var(--sans);letter-spacing:0;color:#35564d}
.app-finance-period{background:white;border:0;border-radius:13px;color:#66846d;font:11px var(--sans);padding:10px 12px;text-transform:capitalize}
.app-finance-tabs{display:flex;gap:3px;background:#e8eee5;border-radius:18px;padding:4px;margin:0 0 19px}
.app-finance-tabs button{flex:1;min-width:0;background:none;border:0;border-radius:14px;padding:11px 2px;font:10px var(--sans);color:#81957e;white-space:nowrap}
.app-finance-tabs button[aria-pressed=true]{background:#31564b;color:#f5cda4}
.app-fin-balance{background:#31564b;border-radius:25px;padding:23px 23px 22px;color:#fff;margin-bottom:27px}
.app-fin-balance>div{display:flex;align-items:center;gap:10px;font:12px var(--sans);color:#c4d7c8}
.app-fin-balance button{padding:0 5px;background:transparent;border:0;color:#c4d7c8;font:22px var(--sans)}
.app-fin-balance>strong{display:block;font:500 clamp(24px,7vw,36px)/1.5 var(--sans);letter-spacing:-1px;margin:11px 0 4px;overflow-wrap:anywhere}
.app-fin-balance p{font:10px/1.8 var(--sans);color:#afc8b7;margin:0 0 7px}
.app-fin-balance>small{font:9px var(--sans);color:#a1bdac}
.app-finance h2{font:500 16px/1.6 var(--sans);letter-spacing:0;color:#35564d;margin:0 0 16px}
.app-fin-analysis{background:white;border-radius:25px;padding:20px 18px;margin-bottom:24px}
.app-fin-donut{position:relative;width:210px;height:210px;max-width:100%;margin:0 auto 15px}
.app-fin-donut>svg{width:100%;height:100%}
.app-fin-donut>div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center;pointer-events:none}
.app-fin-donut strong{font:500 20px/1.5 var(--sans);letter-spacing:-.6px;color:#35564d;overflow-wrap:anywhere}
.app-fin-donut span{font:9px var(--sans);color:#8fa08b;margin-top:7px}
.app-fin-legend{display:grid;gap:12px}
.app-fin-legend>div{display:grid;grid-template-columns:8px minmax(0,1fr) 30px auto;align-items:center;gap:8px}
.app-fin-legend i{width:7px;height:7px;border-radius:50%}
.app-fin-legend span{font:11px var(--sans);color:#7a9079}
.app-fin-legend strong{font:500 10px var(--sans);color:#35564d;text-align:right}
.app-fin-legend small{font:10px var(--sans);color:#8d9f88;min-width:65px;text-align:right}
.app-fin-note{font:9px/1.8 var(--sans);color:#9baa94;margin:17px 0 0}
.app-fin-trend{margin:26px 4px}
.app-fin-bars{display:flex;align-items:flex-end;justify-content:space-between;gap:7px;min-height:132px}
.app-fin-bars button{display:flex;flex:1;min-width:0;flex-direction:column;align-items:center;justify-content:flex-end;background:none;border:0;padding:0;gap:8px}
.app-fin-bars button>span{font:7px var(--sans);color:#99aa94;white-space:nowrap}
.app-fin-bars i{display:block;width:100%;max-width:34px;background:#a5b9a5;border-radius:6px 6px 2px 2px}
.app-fin-bars button:last-child i{background:#31564b}
.app-fin-bars small{font:9px var(--sans);color:#8b9e85;text-transform:capitalize}
.app-fin-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.app-fin-section-head>span{font:10px var(--sans);color:#97a68f}
.app-fin-transactions{margin-top:28px}
.app-fin-transaction{border-bottom:1px solid #e3eadf;padding:0}
.app-fin-transaction>summary{display:flex;align-items:center;gap:11px;padding:17px 0;list-style:none;cursor:pointer}
.app-fin-transaction>summary::-webkit-details-marker{display:none}
.app-fin-tx-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border-radius:13px;background:#e4ece1;color:#31564b;font:20px var(--sans)}
.app-fin-tx-icon.gift{background:#f5dec5}
.app-fin-tx-icon.tip{background:#e8eede}
.app-fin-tx-name{flex:1;min-width:0}
.app-fin-tx-name strong{display:block;overflow-wrap:anywhere;font:500 11px/1.6 var(--sans);color:#35564d}
.app-fin-tx-name small{display:block;font:9px/1.8 var(--sans);color:#a0ad97;margin-top:3px}
.app-fin-transaction summary>b{font:500 11px var(--sans);white-space:nowrap;color:#496b54}
.app-fin-tx-details{background:white;border-radius:18px;padding:16px;margin:0 0 14px;font:10px/1.8 var(--sans);color:#8b9d81;overflow-wrap:anywhere}
.app-fin-tx-details p{margin-bottom:9px}
.app-fin-tx-details p>span{display:block;color:#99a98e;font-size:9px}
.app-fin-tx-details strong{font-weight:400;color:#6c856a}
.app-fin-paging{display:flex;align-items:center;justify-content:center;gap:20px;margin:20px 0;font:10px var(--sans);color:#8a9e80}
.app-fin-paging button{border:0;border-radius:11px;width:32px;height:32px;color:#31564b;background:#e5ede1;font-size:18px}
.app-fin-paging button:disabled{opacity:.35}
.app-fin-source,.app-fin-filters{border-top:1px solid #e1e8db;padding:18px 0;font:10px/1.8 var(--sans);color:#8fa284}
.app-fin-source summary,.app-fin-filters summary{color:#698560;cursor:pointer}
.app-fin-source p{margin-top:12px;overflow-wrap:anywhere}
.app-fin-filters form{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:17px 0}
.app-fin-filters label{font:10px/1.6 var(--sans);color:#8aa07f;display:grid;gap:6px;min-width:0}
.app-fin-filters input,.app-fin-filters select{min-width:0;width:100%;border:0;border-bottom:1px solid #d5dfcd;background:none;padding:10px 0;font:12px var(--sans);color:#31564b}
.app-fin-filters button{border:0;background:#e6eddf;color:#31564b;border-radius:11px;padding:10px;font:11px var(--sans)}
#app-fin-export{color:#567a4e;border-bottom:1px solid #c3d2b8;padding-bottom:4px}
.app-fin-period-dialog select{width:100%;background:#31564b;color:#fff;border:0;border-bottom:1px solid #ffffff40;font:14px var(--sans);padding:12px 0}
.app-fin-period-dialog label{margin-bottom:15px}
.app-fin-period-dialog .site-select>button{background:transparent;border:0;border-bottom:1px solid #ffffff40;color:#fff}
.app-finance #app-fin-status{font:12px var(--sans);color:#9aac8e;margin-bottom:10px}

.app-fin-transaction[hidden],.app-fin-paging[hidden]{display:none!important}
.app-fin-section-head>button{font:10px var(--sans);color:#8aa17c;background:none;border:0;padding:5px 0;white-space:nowrap}
.app-fin-section-head>button[hidden]{display:none}

.app-finance[data-finance-view=overview] .app-fin-transactions,.app-finance[data-finance-view=transactions] .app-fin-analysis,.app-finance[data-finance-view=transactions] .app-fin-trend,.app-fin-type[hidden]{display:none!important}

.app-fin-type{margin:0 2px 20px}
.app-fin-type label{display:grid;gap:9px;font:11px var(--sans);color:#66846d}
.app-fin-type select{width:100%;border:1px solid #dce4db;background:white;border-radius:16px;padding:13px;color:#31564b;font:12px var(--sans)}
.app-fin-type p{font:10px/1.7 var(--sans);color:#8a9d89;margin:10px 0}

#app-fin-all-rows[hidden]{display:none!important}

.app-fin-negative-summary{font:11px/1.7 var(--sans);color:#7d917a;margin:18px 0 0;padding-top:14px;border-top:1px solid #e8ede5}
.app-fin-negative-summary strong{font-weight:500;color:#31564b}

.app-fin-type .site-select>button{border:1px solid #dce4db!important;border-radius:16px!important;background:white!important;padding:13px!important}

.app-fin-receipt-fields{margin:0}
.app-fin-receipt-fields>div{display:grid;grid-template-columns:105px minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid #eaf0e7}
.app-fin-receipt-fields dt{color:#82957e;font-size:10px}
.app-fin-receipt-fields dd{margin:0;color:#35564d;font:11px/1.6 var(--sans);white-space:pre-wrap;overflow-wrap:anywhere}
html:not([data-salon-app]) .app-finance{max-width:1050px;margin:0 auto;padding:12px 8px 35px;color:#35564d}
html:not([data-salon-app]) .app-finance-tabs{max-width:420px;margin-bottom:25px}
html:not([data-salon-app]) .app-finance h1{font:500 25px var(--sans)}
html:not([data-salon-app]) .app-finance #app-fin-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
html:not([data-salon-app]) .app-fin-balance,html:not([data-salon-app]) .app-fin-transactions,html:not([data-salon-app]) .app-fin-source{grid-column:1/-1}
html:not([data-salon-app]) .app-fin-balance{margin:0;padding:24px 30px}
html:not([data-salon-app]) .app-fin-balance>strong{font-size:36px}
html:not([data-salon-app]) .app-fin-analysis{margin:0;background:#fff;border:1px solid #e5ebe3}
html:not([data-salon-app]) .app-fin-trend{margin:0;background:#edf2eb;border-radius:25px;padding:25px 22px}
html:not([data-salon-app]) .app-fin-bars{min-height:230px;padding-top:30px}
html:not([data-salon-app]) .app-fin-bars i{max-width:44px}
html:not([data-salon-app]) .app-fin-transactions{margin-top:0}
html:not([data-salon-app]) .app-fin-type{max-width:420px}
html:not([data-salon-app]) .app-fin-tx-details{background:#eef2eb}
html:not([data-salon-app]) .app-fin-period-dialog{width:min(360px,calc(100vw - 32px));box-sizing:border-box;border:0;border-radius:26px;padding:28px;background:#31564b;color:#fff}
html:not([data-salon-app]) .app-fin-period-dialog::backdrop{background:#18392c70;backdrop-filter:blur(3px)}
html:not([data-salon-app]) .app-fin-period-dialog h2{font:500 20px var(--sans);color:#f5cda4;margin:12px 0 25px}
html:not([data-salon-app]) .app-fin-period-dialog label{display:grid;gap:8px;font:12px var(--sans);color:#dae6dc}
html:not([data-salon-app]) .app-fin-period-dialog .app-recovery-close{float:right;background:none;color:#fff;border:0;font-size:22px}
html:not([data-salon-app]) .app-fin-period-dialog button[type=submit]{width:100%;background:#f5cda4;color:#31564b;border:0;border-radius:14px;font:13px var(--sans);padding:13px;margin-top:20px}
@media(max-width:760px){html:not([data-salon-app]) .app-finance #app-fin-content{grid-template-columns:minmax(0,1fr);gap:20px}html:not([data-salon-app]) .app-finance{padding:0 0 25px}html:not([data-salon-app]) .app-finance h1{font-size:22px}html:not([data-salon-app]) .app-fin-balance{padding:23px}html:not([data-salon-app]) .app-fin-bars{min-height:150px;padding-top:10px}html:not([data-salon-app]) .app-fin-period-dialog{max-height:85dvh;overflow:auto}}
html:not([data-salon-app]) .app-fin-annual{grid-column:1/-1}.app-fin-annual .app-fin-bars{overflow-x:auto;justify-content:flex-start;padding-bottom:5px}.app-fin-annual .app-fin-bars button{min-width:48px}.app-fin-annual .app-fin-bars button>span{font-size:8px}
.app-fin-type{display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:14px;align-items:start}.app-fin-type>p{grid-column:1/-1;margin-top:0!important}html:not([data-salon-app]) .app-fin-type{max-width:none}
@media(max-width:760px){.app-fin-type{grid-template-columns:1fr 1fr;gap:12px}.app-fin-type>label:first-child{grid-column:1/-1}}
.app-fin-heading-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.app-fin-download{display:inline-flex;align-items:center;gap:8px;padding:11px 14px;background:#405f59;color:#f5cda4!important;border:0;border-radius:13px;text-decoration:none!important;font:11px var(--sans);white-space:nowrap}.app-fin-download svg{flex-shrink:0}.app-fin-download:not([href]){opacity:.45;pointer-events:none}
@media(max-width:420px){.app-fin-heading-actions{gap:5px}.app-fin-download{padding:10px;font-size:10px}.app-finance-heading{gap:8px}}
/* One consistent finance navigation row. */
.app-finance .app-finance-tabs{max-width:none!important;width:100%;box-sizing:border-box;align-items:stretch;gap:5px;padding:5px;border-radius:18px;background:#e8eee5}
.app-finance .app-finance-tabs>button{flex:1}
.app-finance .app-finance-tabs .app-fin-heading-actions{display:contents}
.app-finance .app-finance-tabs .app-finance-period,.app-finance .app-finance-tabs .app-fin-download{display:flex;align-items:center;justify-content:center;gap:7px;flex:1;min-width:0;box-sizing:border-box;background:transparent!important;color:#607b67!important;border:0!important;border-radius:14px!important;padding:12px 10px!important;margin:0;font:11px var(--sans)!important;white-space:nowrap;text-decoration:none}
.app-finance .app-finance-tabs>button{font-size:11px!important;padding:12px 10px!important}
.app-finance .app-finance-tabs>button[aria-pressed=true]{background:#31564b!important;color:#f5cda4!important}
@media(max-width:500px){.app-finance .app-finance-tabs{display:grid;grid-template-columns:1fr 1fr}.app-finance .app-finance-tabs .app-fin-download,.app-finance .app-finance-tabs .app-finance-period{font-size:10px!important;padding:11px 7px!important}}
