/* ═══════════════════════════ WealthDesk XP — style.css ═══════════════════════════ */
:root {
  --xp-dark:   #0A246A;
  --xp-mid:    #3D6DB5;
  --xp-light:  #A6CAF0;
  --xp-pale:   #C8E4FF;
  --xp-gray:   #D4D0C8;
  --xp-gbdr:   #848484;
  --trans:     all .22s cubic-bezier(.4,0,.2,1);
  --pos:       #006400;
  --neg:       #8B0000;
  --tbh:       36px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
body{font-family:Tahoma,Verdana,sans-serif;font-size:11px;background:var(--xp-dark);
  background-image:radial-gradient(ellipse at 30% 20%,#1a4a9e 0%,transparent 60%),
                   radial-gradient(ellipse at 80% 80%,#0d3580 0%,transparent 50%);
  height:100vh;overflow:hidden;user-select:none;color:#1a1a1a;}

/* ── Desktop ── */
#desktop{position:fixed;inset:0 0 var(--tbh) 0;overflow:hidden;}

/* ── Desktop Icons ── */
.desktop-icons{position:absolute;top:20px;left:16px;display:flex;flex-direction:column;gap:20px;z-index:1;}
.desktop-icon{display:flex;flex-direction:column;align-items:center;gap:4px;width:72px;cursor:pointer;padding:6px 4px;border-radius:4px;transition:var(--trans);}
.desktop-icon:hover{background:rgba(255,255,255,.15);}
.desktop-icon .icon-img{width:44px;height:44px;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 2px 5px rgba(0,0,0,.55));transition:var(--trans);}
.desktop-icon:hover .icon-img{transform:translateY(-2px) scale(1.06);filter:drop-shadow(0 5px 10px rgba(0,0,0,.65));}
.desktop-icon span{color:#fff;font-size:10px;text-align:center;text-shadow:1px 1px 3px rgba(0,0,0,.9);}

/* ── XP Window ── */
.xp-window{
  position:absolute;background:#fff;
  border:1px solid var(--xp-gbdr);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),3px 3px 0 rgba(0,0,0,.18),5px 5px 14px rgba(0,0,0,.32);
  border-radius:6px 6px 4px 4px;display:flex;flex-direction:column;min-height:60px;
  transition:box-shadow .18s ease,opacity .25s ease,transform .25s cubic-bezier(.4,0,.2,1);
}
.xp-window.is-active{box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),3px 3px 0 rgba(0,0,0,.2),7px 7px 22px rgba(0,0,0,.45);}

/* Minimize / Maximize / Close state classes */
.xp-window.win-min{transform:scaleY(.04) translateY(600px);opacity:0;pointer-events:none;}
.xp-window.win-max{border-radius:0!important;}
.xp-window.win-closed{transform:scale(.86);opacity:0;pointer-events:none;}

/* ── Title Bar ── */
.title-bar{
  height:26px;flex-shrink:0;
  background:linear-gradient(180deg,#5496D4 0%,#3D7BC5 8%,#2268B8 45%,#1a5eaa 50%,#1f6cc0 55%,#3D8AD4 92%,#4A9AE8 100%);
  border-radius:5px 5px 0 0;display:flex;align-items:center;justify-content:space-between;padding:0 6px 0 8px;
  cursor:default;position:relative;
}
.title-bar::after{content:'';position:absolute;inset:0;border-radius:5px 5px 0 0;background:linear-gradient(180deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,0) 50%);pointer-events:none;}
.title-bar.dragging{cursor:grabbing;}
.title-bar-left{display:flex;align-items:center;gap:6px;color:#fff;font-weight:bold;font-size:11px;text-shadow:1px 1px 2px rgba(0,0,0,.5);min-width:0;overflow:hidden;}
.title-icon{flex-shrink:0;}
.tbbtns{display:flex;gap:2px;align-items:center;}
.tb-btn{width:21px;height:21px;border:1px solid;border-radius:3px;font-size:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--trans);font-weight:bold;padding:0;font-family:Tahoma,sans-serif;}
.tb-min,.tb-max{background:linear-gradient(180deg,#e8e8e8,#c0c0c0);border-color:#888 #555 #555 #888;color:#1a1a1a;}
.tb-min:hover,.tb-max:hover{background:linear-gradient(180deg,#f4f4f4,#d4d4d4);}
.tb-cls{background:linear-gradient(180deg,#e05555,#b82020);border-color:#c06060 #801515 #801515 #c06060;color:#fff;font-size:9px;}
.tb-cls:hover{background:linear-gradient(180deg,#f07070,#cc2222);}
.tb-btn:active{box-shadow:inset 1px 1px 3px rgba(0,0,0,.4);transform:scale(.94);}

/* ── Menu Bar ── */
.menu-bar{height:22px;flex-shrink:0;background:var(--xp-gray);border-bottom:1px solid var(--xp-gbdr);display:flex;align-items:center;padding:0 6px;}
.menu-item{padding:3px 8px;cursor:pointer;border-radius:2px;transition:var(--trans);}
.menu-item:hover{background:var(--xp-dark);color:#fff;}

/* ── Window Body ── */
.window-body{flex:1;overflow-y:auto;overflow-x:hidden;padding:12px;background:#fff;}
.window-body::-webkit-scrollbar{width:16px;}
.window-body::-webkit-scrollbar-track{background:var(--xp-gray);border-left:1px solid var(--xp-gbdr);}
.window-body::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#d4d0c8,#c0bdb4);border:1px solid var(--xp-gbdr);border-radius:2px;}
.window-body::-webkit-scrollbar-thumb:hover{background:linear-gradient(90deg,#c0bdb4,#a8a49c);}

/* ── Section Label ── */
.section-label{font-weight:bold;color:var(--xp-dark);margin-bottom:8px;padding-bottom:3px;border-bottom:1px solid var(--xp-light);}

/* ── Cards ── */
.cards-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:4px;}
.summary-card{background:linear-gradient(160deg,#f8fbff,#eaf3ff);border:1px solid #C0C0C0;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),1px 1px 3px rgba(0,0,0,.1);border-radius:3px;padding:10px;display:flex;gap:8px;align-items:flex-start;transition:var(--trans);opacity:0;animation:cardUp .4s ease forwards;}
.summary-card:nth-child(1){animation-delay:.05s}.summary-card:nth-child(2){animation-delay:.10s}.summary-card:nth-child(3){animation-delay:.15s}.summary-card:nth-child(4){animation-delay:.20s}
@keyframes cardUp{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.summary-card:hover{background:linear-gradient(160deg,#f0f8ff,#dbeeff);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),2px 2px 8px rgba(0,100,200,.12);}
.card-icon{width:28px;height:28px;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.card-content{flex:1;min-width:0;}
.card-label{font-size:9px;color:var(--xp-mid);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px;}
.card-value{font-size:15px;font-weight:bold;letter-spacing:-.02em;margin-bottom:2px;}
.card-delta{font-size:9px;color:#555;}

/* ── XP Inset ── */
.xp-inset{border:1px solid;border-color:var(--xp-gbdr) var(--xp-gray) var(--xp-gray) var(--xp-gbdr);box-shadow:inset 1px 1px 0 rgba(0,0,0,.12);background:#fff;border-radius:2px;}

/* ── Chart ── */
.chart-container{padding:10px;height:165px;opacity:0;animation:fadeIn .5s ease .3s forwards;}
.chart-container canvas{max-height:100%;}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* ── Filter Bar ── */
.filter-bar{padding:10px;background:#f5f8ff;margin-bottom:4px;}
.filter-row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;}
.filter-group{display:flex;flex-direction:column;gap:3px;min-width:110px;}
.fg-wide{min-width:180px;flex:1;}
.filter-label{font-size:10px;font-weight:bold;color:var(--xp-dark);text-transform:uppercase;letter-spacing:.04em;}
.filter-summary{margin-top:8px;padding:5px 8px;background:linear-gradient(90deg,#eaf3ff,#f5f8ff);border:1px solid var(--xp-pale);border-radius:2px;display:flex;align-items:center;flex-wrap:wrap;gap:2px;}
.filter-summary strong{color:var(--xp-dark);}

/* ── TX Section Header ── */
.tx-header{display:flex;align-items:center;justify-content:space-between;margin:10px 0 6px;}
.tx-actions{display:flex;align-items:center;gap:6px;}
.sel-info{font-size:10px;font-weight:bold;color:var(--xp-dark);padding:2px 8px;background:#dbeeff;border:1px solid var(--xp-light);border-radius:10px;}

/* ── Table ── */
.table-wrapper{overflow-x:auto;}
.xp-table{width:100%;border-collapse:collapse;font-size:11px;min-width:700px;}
.xp-table thead tr{background:linear-gradient(180deg,#DBEEFF,#C0D8F0);}
.xp-table th{padding:5px 8px;text-align:left;font-weight:bold;color:var(--xp-dark);border-right:1px solid var(--xp-light);border-bottom:2px solid var(--xp-mid);white-space:nowrap;}
.xp-table th.sortable{cursor:pointer;transition:var(--trans);}
.xp-table th.sortable:hover{background:rgba(0,50,150,.1);}
.xp-table th.sort-on{background:linear-gradient(180deg,#c8dff8,#aacaf0);}
.xp-table th:last-child{border-right:none;}
.xp-table tbody tr{border-bottom:1px solid #e8f0f8;transition:background .12s;}
.xp-table tbody tr:nth-child(even){background:#f5f9ff;}
.xp-table tbody tr:hover{background:var(--xp-pale);}
.xp-table tbody tr.row-sel{background:#d8eeff!important;}
.xp-table tbody tr.row-edit{background:#fffbe6!important;}
.xp-table td{padding:4px 8px;border-right:1px solid #e0e8f0;white-space:nowrap;}
.xp-table td:last-child{border-right:none;}
.xp-table td.editable:hover{background:rgba(0,80,200,.06);cursor:pointer;}
.col-chk{width:28px;text-align:center!important;padding:4px!important;}
.col-act{width:70px;text-align:center!important;}
input[type="checkbox"]{width:13px;height:13px;cursor:pointer;accent-color:var(--xp-dark);}

/* Cell editors */
.cell-inp{width:100%;height:20px;padding:1px 4px;font-family:Tahoma,Verdana,sans-serif;font-size:11px;border:1px solid var(--xp-mid);border-radius:2px;background:#fff;outline:none;box-shadow:0 0 0 2px rgba(61,109,181,.2);}
.cell-sel{width:100%;height:20px;padding:1px 2px;font-family:Tahoma,Verdana,sans-serif;font-size:10px;border:1px solid var(--xp-mid);border-radius:2px;background:#fff;outline:none;}

/* Row action buttons */
.row-acts{display:flex;gap:3px;justify-content:center;}
.ra{width:20px;height:18px;border:1px solid;border-radius:2px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:9px;transition:var(--trans);padding:0;background:none;}
.ra-edit{background:linear-gradient(180deg,#e8f0ff,#c8d8f0);border-color:#88a8d8 #4468a8 #4468a8 #88a8d8;color:var(--xp-dark);}
.ra-edit:hover{background:linear-gradient(180deg,#d8e8ff,#b8c8e8);}
.ra-del{background:linear-gradient(180deg,#ffe8e8,#f0c0c0);border-color:#d88888 #a84444 #a84444 #d88888;color:#8B0000;}
.ra-del:hover{background:linear-gradient(180deg,#ffd8d8,#e8a8a8);}
.ra-save{background:linear-gradient(180deg,#e8ffe8,#b8e8b8);border-color:#88c888 #448844 #448844 #88c888;color:#006400;}
.ra-cancel{background:linear-gradient(180deg,#f0f0e8,#d8d4c8);border-color:#ccc #888 #888 #ccc;color:#555;}

/* Status / currency badges */
.tx-status{display:inline-flex;align-items:center;gap:2px;padding:1px 6px;border-radius:10px;font-size:9px;font-weight:bold;}
.tx-status.cleared{background:#e8f8e8;color:#006400;border:1px solid #90c890;}
.tx-status.pending{background:#fff8e0;color:#856000;border:1px solid #d4b800;}
.cur-badge{display:inline-block;padding:1px 5px;background:#eaf3ff;border:1px solid var(--xp-pale);border-radius:3px;font-size:9px;font-weight:bold;color:var(--xp-dark);}
.tx-credit{color:var(--pos);font-weight:bold;}
.tx-debit{color:var(--neg);font-weight:bold;}

/* Empty state */
.tx-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:30px;color:#888;}

/* Pagination */
.pagination{display:flex;align-items:center;gap:8px;padding:8px 10px;border-top:1px solid #e0e8f0;background:#f8faff;}
.pg-info{font-size:11px;color:var(--xp-dark);flex:1;text-align:center;}

/* ── Status Bar ── */
.status-bar{height:22px;flex-shrink:0;background:var(--xp-gray);border-top:1px solid var(--xp-gbdr);display:flex;align-items:center;border-radius:0 0 3px 3px;}
.status-seg{padding:0 10px;font-size:10px;border-right:1px solid var(--xp-gbdr);height:100%;display:flex;align-items:center;}
.status-seg:last-child{border-right:none;}

/* ── Form Controls ── */
.form-group{margin-bottom:10px;}
.xp-label{display:block;font-size:11px;font-weight:bold;margin-bottom:3px;}
.req{color:#cc0000;}
.xp-input,.xp-select{width:100%;height:22px;padding:2px 6px;font-family:Tahoma,Verdana,sans-serif;font-size:11px;background:#fff;border:1px solid;border-color:var(--xp-gbdr) var(--xp-gray) var(--xp-gray) var(--xp-gbdr);box-shadow:inset 1px 1px 2px rgba(0,0,0,.1);border-radius:2px;outline:none;transition:var(--trans);color:#1a1a1a;}
.xp-input:focus,.xp-select:focus{border-color:var(--xp-mid);box-shadow:inset 1px 1px 2px rgba(0,0,0,.1),0 0 0 2px rgba(61,109,181,.22);}
.input-pfx{display:flex;align-items:center;border:1px solid;border-color:var(--xp-gbdr) var(--xp-gray) var(--xp-gray) var(--xp-gbdr);box-shadow:inset 1px 1px 2px rgba(0,0,0,.1);border-radius:2px;background:#fff;overflow:hidden;transition:var(--trans);}
.input-pfx:focus-within{border-color:var(--xp-mid);box-shadow:inset 1px 1px 2px rgba(0,0,0,.1),0 0 0 2px rgba(61,109,181,.22);}
.pfx{padding:0 6px;font-weight:bold;color:var(--xp-dark);background:#f0f5ff;height:22px;display:flex;align-items:center;border-right:1px solid #C0C0C0;white-space:nowrap;font-size:11px;}
.input-pfx .xp-input{border:none;box-shadow:none;border-radius:0;flex:1;height:22px;}
.input-pfx .xp-input:focus{border:none;box-shadow:none;}

/* ── Buttons ── */
.xp-btn{height:23px;padding:0 14px;font-family:Tahoma,Verdana,sans-serif;font-size:11px;color:#1a1a1a;
  background:linear-gradient(180deg,#f0f0e8,#d8d4c8 50%,#c8c4b8 51%,#d4d0c4);
  border:1px solid;border-color:#fff #888 #888 #fff;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.8),inset -1px -1px 0 rgba(0,0,0,.2);
  border-radius:3px;cursor:pointer;transition:var(--trans);display:inline-flex;align-items:center;justify-content:center;gap:4px;}
.xp-btn:hover{background:linear-gradient(180deg,#f8f8f0,#e4e0d4 50%,#d4d0c4 51%,#e0dcd0);border-color:var(--xp-mid);}
.xp-btn:active{background:linear-gradient(180deg,#c8c4b8,#d8d4c8);box-shadow:inset 1px 1px 3px rgba(0,0,0,.25);transform:scale(.98);}
.xp-btn-primary{background:linear-gradient(180deg,#4a90d4,#2a6db8 50%,#1a5da8 51%,#2870c0);color:#fff;border-color:#88bce8 #0a3a80 #0a3a80 #88bce8;text-shadow:0 1px 1px rgba(0,0,0,.3);}
.xp-btn-primary:hover{background:linear-gradient(180deg,#5aa0e4,#3a7dc8 50%,#2a6db8 51%,#3880d0);}
.xp-btn-danger{background:linear-gradient(180deg,#e05555,#b82020 50%,#a81818 51%,#c82828);color:#fff;border-color:#f08080 #881010 #881010 #f08080;text-shadow:0 1px 1px rgba(0,0,0,.3);}
.xp-btn-danger:hover{background:linear-gradient(180deg,#f06666,#cc2828);}
.xp-btn-sm{height:18px;padding:0 8px;font-size:10px;}
.btn-row{display:flex;gap:8px;justify-content:flex-end;margin-top:8px;}

/* ── Modal ── */
.modal-bg{position:fixed;inset:0;background:rgba(0,20,80,.45);backdrop-filter:blur(10px);z-index:9000;display:flex;align-items:center;justify-content:center;animation:mfadeIn .18s ease;}
@keyframes mfadeIn{from{opacity:0}to{opacity:1}}
.modal-win{position:relative!important;top:auto!important;left:auto!important;animation:mscale .2s cubic-bezier(.4,0,.2,1);}
@keyframes mscale{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.modal-full{grid-column:1/-1;}
.modal-err{margin-top:8px;padding:6px 10px;background:#ffe8e8;border:1px solid #f09090;border-radius:3px;color:#8B0000;}
.radio-grp{display:flex;gap:14px;align-items:center;height:22px;}
.radio-lbl{display:flex;align-items:center;gap:4px;cursor:pointer;}
.radio-lbl input{width:13px;height:13px;cursor:pointer;accent-color:var(--xp-dark);}

/* ── Transfer confirm ── */
.tf-confirm{margin-top:10px;padding:7px 10px;background:#e8f8e8;border:1px solid #90c890;border-radius:3px;color:#006400;animation:slideDown .22s ease;}
@keyframes slideDown{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}

/* ── Statements ── */
.stmt-list{display:flex;flex-direction:column;gap:4px;}
.stmt-row{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;background:#f8faff;border:1px solid #e0e8f0;border-radius:2px;transition:var(--trans);}
.stmt-row:hover{background:var(--xp-pale);border-color:var(--xp-light);}

/* ── Taskbar ── */
#taskbar{position:fixed;bottom:0;left:0;right:0;height:var(--tbh);
  background:linear-gradient(180deg,#2878d0,#1a6ac0 40%,#1060b0 60%,#1a6ac0);
  border-top:2px solid #3d90e0;display:flex;align-items:center;gap:4px;padding:0 4px;z-index:8000;
  box-shadow:0 -2px 8px rgba(0,0,0,.4);}
#start-btn{height:30px;padding:0 14px 0 10px;background:linear-gradient(180deg,#5bb85b,#3a9a3a 50%,#2a8a2a 51%,#3a9a3a);border:1px solid;border-color:#9de89d #1a6a1a #1a6a1a #9de89d;border-radius:14px;color:#fff;font-family:Tahoma,Verdana,sans-serif;font-size:12px;font-weight:bold;font-style:italic;cursor:pointer;display:flex;align-items:center;gap:6px;text-shadow:0 1px 2px rgba(0,0,0,.4);box-shadow:0 1px 4px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.3);}
#start-btn:hover{background:linear-gradient(180deg,#6bc86b,#4aaa4a 50%,#3a9a3a 51%,#4aaa4a);}
.tb-divider{width:2px;height:24px;background:linear-gradient(180deg,transparent,rgba(255,255,255,.15),transparent);border-left:1px solid rgba(0,0,0,.3);margin:0 2px;}
#tb-wins{flex:1;display:flex;gap:3px;overflow:hidden;}
.tw{height:28px;padding:0 10px;background:linear-gradient(180deg,#2a78d8,#1a62b8);border:1px solid;border-color:#90c0f0 #0a3a80 #0a3a80 #90c0f0;border-radius:3px;color:#fff;font-size:10px;display:flex;align-items:center;gap:6px;cursor:pointer;transition:var(--trans);min-width:80px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 0 1px 0 rgba(255,255,255,.2);}
.tw.active{background:linear-gradient(180deg,#1060a8,#0a4a90);border-color:#0a3a80 #90c0f0 #90c0f0 #0a3a80;box-shadow:inset 1px 1px 3px rgba(0,0,0,.3);}
.tw:hover:not(.active){background:linear-gradient(180deg,#3a88e8,#2a72c8);}
.tw.win-gone{opacity:.35;pointer-events:none;}
.tb-tray{display:flex;align-items:center;padding:0 8px 0 12px;height:100%;border-left:1px solid rgba(255,255,255,.1);}
#clock{color:#fff;font-size:11px;text-shadow:0 1px 2px rgba(0,0,0,.4);white-space:nowrap;}

.hidden{display:none!important;}
html::-webkit-scrollbar{width:0;}