*{margin:0;padding:0;box-sizing:border-box}@font-face{font-family:Public Sans Regular;src:url(/fonts/PublicSans-Regular.ttf) format("truetype")}@font-face{font-family:Public Sans Bold;src:url(/fonts/PublicSans-Bold.ttf) format("truetype")}body{background-color:#f8f4f0;font-family:Public Sans Regular,sans-serif}.text-1{font-size:32px;font-family:Public Sans Bold,sans-serif;line-height:120%}.text-2{font-size:20px;font-family:Public Sans Bold,sans-serif;line-height:120%}.text-3{font-size:16px;font-family:Public Sans Bold,sans-serif;line-height:150%}.text-4{font-size:14px;font-family:Public Sans Regular,sans-serif;line-height:150%}.text-4-bold{font-size:14px;font-family:Public Sans Bold,sans-serif;line-height:150%}.text-5{font-size:12px;font-family:Public Sans Regular,sans-serif;line-height:150%}.text-5-bold{font-size:12px;font-family:Public Sans Bold,sans-serif;line-height:150%}.padding-500{padding:40px}.padding-400{padding:32px}.padding-300{padding:24px}.padding-250{padding:20px}.padding-200{padding:16px}.padding-150{padding:12px}.padding-100{padding:8px}.padding-50{padding:4px}.margin-500{margin:40px}.margin-400{margin:32px}.margin-300{margin:24px}.margin-250{margin:20px}.margin-200{margin:16px}.margin-150{margin:12px}.margin-100{margin:8px}.margin-50{margin:4px}main{width:100%;height:100%;display:grid;grid-template-columns:300px 1fr;position:relative}input[type=submit]{background-color:#000;color:#fff;font-weight:800;font-size:13px;padding-top:15px;padding-bottom:15px;border:none;cursor:pointer;transition:.2s ease}input.icon-input{padding-right:34px}input[type=submit]:hover{background-color:#6b6b6b}input{margin-top:10px;padding:15px;border-radius:7px;border:1px solid #98908b;font-size:16px;font-weight:500}input.full-width{width:100%}button{margin-top:10px;padding:10px 15px;border-radius:7px;border:1px solid black;font-size:14px;background-color:transparent;display:flex;align-items:center;cursor:pointer}button.add-button{background-color:#000;color:#fff;padding:17px;font-weight:600}button:disabled{background-color:#e0e0e0;border:1px solid #b0b0b0;color:#7a7a7a;cursor:not-allowed;opacity:.7}button .arrow-sign{font-size:10px}button.transaction-button{border-color:gray;color:gray;gap:15px;font-size:15px;font-weight:600}button.transaction-button:enabled:hover{border-color:#666;color:#fff;background-color:#666}.select-input{padding:10px;border:1px solid black;position:relative;margin-top:10px;border-radius:7px;font-size:15px;font-weight:400;display:flex;align-items:center;justify-content:center}.select-input .lists.active{display:flex}.select-input img{transition:.2s ease}.select-input img.active{transform:rotate(180deg)}.select-input .title{display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none;transform:translateY(50%)}.select-input .lists{position:absolute;top:100%;left:0;background-color:#fff;display:none;flex-direction:column;align-items:flex-start;padding:5px 10px;box-shadow:0 4px 6px #1e1e1e;margin-top:15px;border-radius:8px;white-space:nowrap;max-height:300px;overflow-y:auto}.select-input .lists p{padding:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.select-input .lists p.active{font-weight:800}.loader{width:100%;min-height:100vh;background-color:#ffebcd;z-index:100;position:absolute}.login-page{display:grid;grid-column:1/-1;grid-template-columns:1fr 1fr 1fr;grid-template-rows:max-content auto;height:100vh;width:100%;box-sizing:border-box;padding-bottom:20px}.image-place{position:relative;grid-column:1/2;grid-row:2 / 3;padding-top:20px;padding-left:20px;margin-bottom:20px}.image-place>img{border-radius:12px;position:absolute;width:100%;height:100%;object-fit:cover}.image-place .texts{height:100%;position:relative;color:#fff;display:flex;flex-direction:column;justify-content:space-between}.image-place .texts img{width:123px;height:25px}.login-place{grid-column:2 / 4;grid-row:2 / 3;padding-right:20px;padding-top:20px}.login-page-header{background-color:#201f24;border-bottom-left-radius:8px;border-bottom-right-radius:8px;grid-row:1 / 2;grid-column:1 / -1;display:none}.login-page-header img{margin-left:auto;margin-right:auto;display:block}.login-box{background-color:#fff;padding:30px;border-radius:12px;max-width:560px;position:relative;top:50%;left:50%;transform:translate(-50%,-50%)}.login-box h1{margin-bottom:30px}.login-box .input-box{color:#777676;font-size:14px;font-weight:600}.login-box input:focus{outline-offset:5px}.password-field{position:relative;display:flex;align-items:center}.password-field img{position:absolute;right:10px;top:60%;transform:translateY(-50%);width:20px;height:20px;object-fit:contain;cursor:pointer}.account-creation-text{margin-top:20px;color:#777676;text-align:center}.account-creation-text a{color:#000;font-weight:700;line-height:23px;text-underline-offset:2px}nav{grid-column:1/2;height:100vh;background-color:#201f24;border-radius:0 16px 16px 0;position:sticky;top:0}nav>img{padding:40px 30px 30px 32px}nav ul{padding:28px 25px 25px 0}nav li{list-style:none;border-radius:0 12px 12px 0}nav li a{padding:18px 18px 18px 35px;border-radius:0 12px 12px 0;text-decoration:none;color:#b3b3b3;font-size:16px;font-weight:700;display:flex;align-items:center;gap:20px;transition:.09s ease}nav li a.active{color:#000;background-color:#f8f4f0;border-left:4px solid #277c78}nav li a.active:hover{color:#000}nav li a:hover{color:#fff}.main-content{grid-column:2/3;overflow-y:auto;padding:40px}.content{margin-top:35px;width:100%;display:flex;flex-direction:column;gap:30px}.three-money-states{display:flex;justify-content:space-between}.three-money-states .money-state{background-color:#fff;padding:25px;border-radius:12px;width:32%}.three-money-states .money-state p{font-size:14px}.three-money-states .money-state h2{font-size:35px}.bottom-content{width:100%;display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between}.details-card{width:49%;background-color:#fff;padding:30px;border-radius:12px}.details-card .card-title{display:flex;justify-content:space-between}.details-card .card-title a{text-decoration:none;color:#999a99;font-size:14px;font-weight:600;display:flex;align-items:center;gap:20px}.details-card .card-title a:hover{color:#000}.details-card .card-title a img{width:4px}.transaction-place{width:100%;background-color:#fff;padding:30px;border-radius:13px}.search-and-filter{display:flex;justify-content:space-between;align-items:center;gap:20px}.search-and-filter .sort-filter{display:flex;gap:20px;align-items:center}.search-and-filter .sort-filter>div{display:flex;align-items:center;gap:10px}.search-and-filter .sort-filter>div>p{margin-top:8px}.main-content-transactions{display:flex;flex-direction:column;justify-content:space-between;min-height:860px}.clients-table{margin-top:30px;width:100%}.clients-table thead{font-size:13px;color:#818e99}.clients-table thead td{border:none}.clients-table td{border-bottom-width:2px;border-bottom-style:solid;border-bottom-color:#f2f2f2;padding:13px}.clients-table tr:last-of-type td{border-bottom:none}.clients-table td img{width:40px;border-radius:50%}.clients-table td>div{display:flex;align-items:center;gap:17px}.clients-table td.small-class{font-size:13px;color:#818e99}.clients-table td.name,.clients-table td.amount{font-weight:700}.clients-table td.name{font-size:14px}.clients-table td.amount{text-align:right;font-size:14px}.clients-table td.positive{color:#277c78}.bottom-buttons-nav{display:flex;justify-content:space-between;margin-top:30px}.pagination-buttons{display:flex;margin-top:auto;gap:10px}.pagination-buttons button{font-size:15px;font-weight:600}.pagination-buttons button:hover{color:#fff;background-color:#777;border-color:#777}.pagination-buttons button.active{background-color:#000;color:#fff}.pagination-buttons button.active:hover{color:#fff;background-color:#777;border-color:#777}.title{display:flex;justify-content:space-between;align-items:center;position:relative;bottom:9px}.title button{margin:0}.spending-summary{background-color:#fff;max-width:390px;display:flex;flex-direction:column;align-items:center;padding:30px;gap:20px;border-radius:10px}.details{width:100%}.budget-item{display:flex;align-items:center;margin-bottom:8px}.budget-color-bar{width:4px;height:20px;margin-right:8px;border-radius:2px}.budget-info{margin:0;font-size:14px;color:#666;padding:10px;width:100%;display:flex;justify-content:space-between;align-items:center}.budget-info p{margin:0}.budget-info b{font-size:16px;color:#000}.budget-info span{font-size:12px;color:#666}.budget-divider{border:none;border-top:1px solid #eee;margin:8px 0}.budget-cards{display:flex;justify-content:space-between;gap:20px;width:100%}.right-side-content{display:flex;flex-direction:column;gap:20px;width:100%}.budget-card{width:100%;background-color:#fff;border-radius:10px}.recharts-responsive-container{width:250px!important;height:240px!important}.recharts-responsive-container path{transition:"fill 0.3s"}@media screen and (max-width:1055px){.main-content{grid-column:1/-1}nav{grid-column:unset;position:fixed;width:100%;height:70px;top:86.8%;z-index:99;border-radius:10px 10px 0 0;display:flex;flex-direction:column;justify-content:center;padding:7px 30px 0}nav ul{display:flex;justify-content:space-between;padding:0}nav li{border-radius:12px 12px 0 0;width:110px}nav li a{flex-direction:column;align-items:center;justify-content:center;border-radius:12px 12px 0 0;gap:10px;font-size:12px;padding:4px 0;height:63px}nav li a.active{border-bottom:4px solid #277c78;border-left:none}nav>img{display:none}}@media screen and (max-width:1056px){.login-page-header{display:block}.image-place{display:none}.login-place{grid-column:1 / -1;padding-inline:20px}}
