:root{--pt-black: #111012;--pt-black2: #18181c;--pt-white: #ffffff;--pt-gray: #77808d;--pt-gray-light: #c9ced3;--pt-gray-lighter: #f5f6f7;--pt-gray-hover: #f9fafb;--input-gray: #f4f5f6;--border-gray: #e7e8ea;--gray-text-button: #c7e3cf;--faded-blue: #90acf9;--button-blue: #1352f0;--button-blue-light: #eaeffe;--special-button-blue: #0b41c1;--button-blue-hover: #1249d8;--button-green: #e6f7eb;--button-green-hover: #2fa159;--button-red: #fdefee;--button-red-hover: #e23939;--pie-orange: #fec05a;--sport-button-orange: #f9f5ec;--sport-button-orange-hover: #e0a001;--sport-button-blue: #e8edf6;--sport-button-blue-hover: #0040a0;--to-win-green: #41c772}@font-face{font-family:Inter;src:url(/Positarget--Frontend/assets/Inter_24pt-ExtraLight-777553c7.ttf) format("truetype");font-weight:500}.inter-font-bold{font-family:Inter,sans-serif;font-optical-sizing:auto;font-weight:490;font-style:bold}@font-face{font-family:izmir-light;src:url(/Positarget--Frontend/assets/Izmir-Light-82b8df7c.otf) format("truetype");font-weight:500}@font-face{font-family:izmir;src:url(/Positarget--Frontend/assets/Izmir-Regular-fb85918a.otf) format("truetype");font-weight:500}@font-face{font-family:izmir-medium;src:url(/Positarget--Frontend/assets/Izmir-Medium-a8cf22e3.otf) format("truetype");font-weight:500}@font-face{font-family:izmir-semibold;src:url(/Positarget--Frontend/assets/Izmir-Semibold-04388d46.otf) format("truetype");font-weight:500}@font-face{font-family:izmir-bold;src:url(/Positarget--Frontend/assets/IzmirNarrow-Bold-a75a9c1d.otf) format("truetype");font-weight:500}.flex{display:flex}.flex>.full{flex:1}.flex.column{flex-direction:column}.flex.justify-center{justify-content:center}.flex.align-center{align-items:center}.debug *{outline:1px solid gold}.main-container{display:grid;grid-template-columns:minmax(20px,1fr) minmax(0,1200px) minmax(20px,1fr)}@media (max-width: 624px){.main-container{grid-template-columns:minmax(16px,1fr) minmax(0,624px) minmax(16px,1fr)}}.main-container>*{grid-column:2}.main-container>*.full{grid-column:1 / -1}.sample-grid-layout{display:grid;grid-template-columns:12px 1fr 12px}@media (min-width: 624px){.sample-grid-layout{grid-template-columns:minmax(16px,1fr) minmax(auto,624px) minmax(16px,1fr)}}@media (min-width: 784px){.sample-grid-layout{grid-template-columns:minmax(16px,1fr) minmax(auto,784px) minmax(16px,1fr)}}@media (min-width: 1048px){.sample-grid-layout{grid-template-columns:minmax(16px,1fr) minmax(auto,1048px) minmax(16px,1fr)}}.sample-grid-layout>*{grid-column:2}.sample-grid-layout>*.full{background-color:var(--clr1);grid-column:1 / -1}.sample-grid-layout>*:not(.full){background-color:var(--clr4)}.grid-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:10px}.grid-container>article{border:1px solid #ccc;border-radius:6px;padding:2rem;text-align:center;display:grid;grid-template-rows:subgrid;grid-row:span 3}*{box-sizing:border-box}body{margin:0 auto;font-family:izmir-medium,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;color:--var(clr2);font-weight:600;letter-spacing:.3px}h1,h2,h3,h4,h5,h6{margin:0 0 .6em}p{margin:0 0 1em}a{text-decoration:none;color:unset}ul{list-style:none;padding:0;margin:0}input{max-width:100%}img,embed,video,object{max-width:100%;display:block}.icon{color:var(--pt-gray)}.icon.full{fill:var(--button-blue-hover)}button{padding:.5em .8em;border:0;margin:.5em;cursor:pointer;background-color:var(--clr1)}button:hover{transition:.3s;background-color:var(--clr1-light)}.main-container>main{min-height:calc(100vh - 9rem)}.fancy-box{background-color:gold;padding:5px;margin:5px;text-align:center}.split-pane>div{transition:.5s}.example-enter{opacity:.01}.example-enter.example-enter-active{opacity:1;transition:opacity .5s ease-in}.example-leave{opacity:1;transform:scale(1.3)}.example-leave.example-leave-active{opacity:.01;transform:scale(1);transition:all .3s ease-in}.proj-preview{background-color:teal;color:#f5f5f5;padding:5px;margin:3px}.user-details .user-img{height:200px;width:200px;background-size:contain}.login-page{display:grid;place-content:center;z-index:100;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:450px;height:500px;background-color:var(--pt-white);border-radius:2em;text-align:center}.login-page.signup{height:500px}.login-form,.signup-form{display:grid;width:100%;margin:auto;justify-content:center;gap:1em;padding:1em;background-color:var(--clr4);input {padding: .8em; border-radius: 7.2px; border: 1px solid var(--border-gray); width: 300px; height: 50px;}}.signup-form>input{width:100%;margin:.4em 0}.signup-form .admin-toggle{display:flex;align-items:center;justify-self:start}.signup-form .admin-toggle>span{font-size:.8em}.login-page nav{display:flex;align-items:center;justify-content:center;gap:2em;margin-block:100px .5em}.login-page nav>a{font-size:.8em;color:var(--clr4)}.login-page nav>a:hover{color:var(--clr1)}.login-page nav>a.active{text-decoration:underline;color:var(--clr2)}.guest-btn{margin-top:1em;padding:.8em;border-radius:7.2px;border:1px solid var(--border-gray);width:300px;height:50px;background-color:var(--clr4);color:var(--pt-white);cursor:pointer;background-color:var(--button-blue-hover)}.chat{li:nth-child(odd) {background-color: whitesmoke;} form {display: flex; gap: 1em; >input {flex-grow: 1;}}}.chat li{padding-inline-start:.3em;font-size:.9em}.chat-options{display:flex;gap:1em;padding:.5em;background-color:var(--clr4);accent-color:black;label:last-of-type {margin-inline-start: auto;}}.app-header{display:grid;grid-template-columns:inherit;position:sticky;top:0;min-height:3.5rem;padding:.8rem 1rem;background-color:var(--pt-white);border-bottom:1px solid var(--border-gray);padding-bottom:1em;padding-top:1em;z-index:100}.app-header .inner-container{display:grid;gap:1.5em;grid-template-columns:subgrid;grid-column:2}@media (max-width:650px){.app-header .inner-container{gap:.5em}}.app-header nav{margin:1fr;display:flex;width:100%;align-items:center;gap:1em;justify-content:space-between;font-size:.8em}.app-header nav .logo{font-size:1.8em;align-items:center;img {width: 45px; flex-shrink: 0;}}@media (max-width: 650px){.app-header nav .logo .inter-font-bold{display:none}}.app-header nav button{margin-inline-end:0}.app-header nav.options-carusel{display:flex;gap:24px;overflow-x:auto;white-space:nowrap;scrollbar-width:none;align-items:center;font-size:.9em;font-weight:480;transition:mask-image .3s ease,-webkit-mask-image .3s ease;--mask-left: black;--mask-right: black;mask-image:linear-gradient(to right,var(--mask-left),black 10%,black 90%,var(--mask-right));-webkit-mask-image:linear-gradient(to right,var(--mask-left),black 10%,black 90%,var(--mask-right));a:hover {color: var(--pt-black2);} a.active {color: var(--pt-black2);}}.app-header nav.options-carusel.scrolled-left{--mask-left: transparent}.app-header nav.options-carusel.scrolled-right{--mask-right: transparent}.app-header nav.options-carusel>*{cursor:pointer;display:flex;gap:.5em;align-items:center;color:var(--pt-gray);flex-shrink:0}.app-header nav.options-carusel::-webkit-scrollbar{display:none}.app-header .user-info{display:flex;align-items:center;position:relative;margin-inline-start:1em;gap:.5em;color:var(--clr1)}.app-header .user-info .score{padding:8px;background-color:var(--clr2);border-radius:50%;margin:10px;color:var(--gray1)}.app-header .user-info img{width:2.6em;aspect-ratio:1;border-radius:50%;flex-shrink:0}.search-container{flex-grow:1;position:relative;input {height: 39px; font-size: 1.1em; width: 100%; background-color: var(--input-gray); border-radius: 7.2px; border: none; padding: 16px 10px 16px 2.3em; letter-spacing: .3px;} input:focus,input.open {outline: 1px solid var(--border-gray); border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-color: var(--pt-white);} .icon.search {position: absolute; left: 10px; top: 28%; transform: translateY(-50%); width: 16px; height: 16px; transform: scale(1.1);}}.signup-link{cursor:pointer;font-size:1.1em;color:var(--pt-white);background-color:var(--button-blue);padding:10px 16px;border-radius:7.2px;min-width:max-content}.signup-link:hover{background-color:var(--button-blue-hover)}.signup-link:active{transform:scale(.97)}.signup-link.guest{background-color:#0a808b}.signup-link.guest:hover{background-color:#07757f}.login-link{cursor:pointer;font-size:1.1em;color:var(--button-blue);margin-inline-start:auto;padding:10px 16px;min-width:max-content}.login-link:hover{background-color:var(--input-gray);border-radius:7.2px}.img-container{display:flex;align-items:center;gap:.5em;cursor:pointer;margin-inline-start:1.1em;border-radius:2em}.img-container:hover{background-color:var(--input-gray);outline:8px solid var(--input-gray)}.img-container:hover .arrow{transform:rotate(180deg);transition-delay:0s}.arrow{transition:transform .3s ease;transition-delay:.3s}.bell{position:relative;transform:scale(1.2) translateY(1px)}.info-item.bell{padding:8px 6px}.info-item{cursor:pointer;color:var(--pt-gray);padding:4px;border-radius:7.2px;flex-direction:column;align-items:center;gap:1px;margin-inline:4px;h5 {font-size: 1em; font-weight: 300; margin: 0;} .sum {font-size: 1.2em; font-weight: 600; color: var(--button-green-hover);} &:hover {background-color: var(--input-gray);}}.bell:before{content:"";position:absolute;display:block;left:33px;top:8px;height:20px;border-right:solid 1px var(--border-gray)}.dropdown-menu{position:absolute;top:10px;right:0;background-color:var(--pt-white);border:1px solid var(--border-gray);border-radius:7.2px;display:none;flex-direction:column;min-width:150px;z-index:100;text-align:center;li>* {display: grid; place-items: center; margin: 5px; height: 40px; cursor: pointer; border-radius: 7.2px; &:hover {background-color: var(--input-gray);}} li:first-child a {height: 64px;} li:last-child a {color: var(--button-red-hover);} li:not(:last-child) {border-bottom: 1px solid var(--border-gray);}}.dropdown-menu.open{display:flex}.dropdown-menu.notifications{min-width:400px;header {text-align: start; padding: 1em; font-size: 1.2em; font-weight: 400;} .icon {transform: scale(1.2);} .inner-container {font-weight: 400; padding: 1em; margin-bottom: 1em; color: var(--pt-gray); display: grid; place-items: center;}}.search-modal{position:absolute;width:100%;top:38px;height:max-content;border-radius:0 0 7.2px 7.2px;z-index:100;background-color:var(--pt-white);outline:1px solid var(--border-gray);padding:2em 1em 1.5em;display:none;header {color: var(--pt-gray); font-size: .8em; font-weight: 300;} &.open {display: block;}}.browse-container{display:flex;gap:.5em;margin:1em 0}.topics-container{margin-top:1em;display:grid;gap:1em;grid-template-columns:repeat(2,minmax(120px,1fr));width:100%}.browse-item{display:flex;gap:.5em;align-items:center;color:var(--pt-black2);cursor:pointer;border:1px solid var(--border-gray);padding:6px 10px;border-radius:12px}.browse-item:hover{background-color:var(--input-gray)}.topic-item{color:var(--pt-gray);cursor:pointer;border:1px solid var(--border-gray);padding:12px 10px;border-radius:12px}.topic-item:hover{background-color:var(--input-gray)}@media (max-width: 940px){.app-header .search-container.wide-screen{display:none}}@media (max-width: 650px){.app-header .info-item:not(.bell),.app-header .signup-link{display:none}.app-header{grid-template-columns:revert}.app-header .arrow{display:none}}.side-menu{position:fixed;top:0;left:0;width:280px;height:100dvh;background:var(--pt-white);border-right:1px solid var(--border-gray);z-index:1001;display:flex;flex-direction:column;padding:1.5rem;box-shadow:4px 0 24px #0006}.side-menu .close{align-self:flex-end;background:none;border:none;color:var(--clr-text);font-size:1.2rem;cursor:pointer;opacity:.6}.side-menu .close:hover{opacity:1}.side-menu .content{margin:0;padding:0;a {margin-bottom: 1em;} text-align: center;margin-top:2rem;display:grid;gap:.5rem}.side-menu .logout{color:var(--button-red-hover)}.app-footer{display:none;align-items:center;justify-content:space-between;min-height:3.5rem;z-index:100;padding:.8rem 1.5rem;background-color:var(--pt-white);border-top:1px solid var(--border-gray);position:fixed;bottom:0}.app-footer .icon-wrapper{display:grid;place-items:center;cursor:pointer}.app-footer .icon-wrapper:hover{background-color:transparent}.app-footer .icon-wrapper:hover .icon,.app-footer .icon-wrapper.active .icon,.app-footer .icon-wrapper.active h4{color:var(--pt-black2)}@media (max-width: 650px){.app-footer{display:flex}}.modal{width:400px;height:content;background-color:var(--pt-white);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:2em;box-shadow:0 2px 10px #0000001a;max-height:90vh;padding:2em;z-index:1000;display:grid;place-content:center;text-align:center;gap:2em;input {padding: .8em; border-radius: 7.2px; border: 1px solid var(--border-gray); width: 200px; height: 50px;} .inputs-container {align-items: center; gap: 1em;}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000;opacity:.5;z-index:1000}.radix-trigger{all:unset;display:inline-flex;align-items:center;justify-content:space-between;padding:0 .8em;border-radius:7.2px;border:1px solid var(--border-gray);background-color:var(--pt-white);width:100px;height:50px;box-sizing:border-box;font-size:.8em}.radix-trigger:focus{border-color:var(--button-blue);box-shadow:0 0 0 1px var(--button-blue)}.radix-content{background-color:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;border:1px solid var(--border-gray);z-index:1100;min-width:100px}.radix-item{padding:10px 15px;cursor:pointer;outline:none;font-size:14px;border-radius:4px;margin:4px}.radix-item:hover,.radix-item:focus{background-color:var(--input-gray)}.radix-icon{display:flex;align-items:center;justify-content:center;transition:transform .3s cubic-bezier(.87,0,.13,1)}.radix-trigger[data-state=open] .radix-icon{transform:rotate(180deg)}.radix-content{background-color:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;border:1px solid var(--border-gray);z-index:1100;min-width:100px;animation:slideDown .2s ease-out}.modal input:focus{outline:2px solid var(--input-gray)}.radix-trigger:focus{outline:none;border-color:var(--border-gray);box-shadow:0 0 0 0 var(--border-gray)}@keyframes slideDown{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.delete-modal,.transaction-modal{background-color:var(--pt-white);height:max-content;padding:2em;border-radius:15.2px;box-shadow:0 2px 10px #0000001a;display:grid;place-content:center;span {font-family: "izmir-bold";}}.react-confirm-alert-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999;display:flex;align-items:center;justify-content:center;animation:react-confirm-alert-fadeIn .1s}.react-confirm-alert-body{width:auto;background:transparent}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalEntry{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.react-confirm-alert-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:fadeIn .2s ease-out forwards}.delete-modal,.transaction-modal{animation:modalEntry .4s cubic-bezier(.16,1,.3,1) forwards;background:white;border-radius:1.5em;box-shadow:0 10px 25px #0003}.app-msg{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);background-color:var(--pt-white);padding:.8rem 1.2rem;border-radius:4px;box-shadow:0 2px 8px #00000026;z-index:1000;p {font-size: 1.1em; font-weight: 400; margin: 0;} &.success {color: var(--pt-white); background-color: var(--button-green-hover);} &.error {color: var(--pt-white); background-color: var(--button-red-hover);}}.dots-loader{display:flex;justify-content:center;align-items:center;gap:6px;height:40px}.dot{width:8px;height:8px;background-color:#2563eb;border-radius:50%;animation:dot-pulse 1.2s infinite ease-in-out}.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}@keyframes dot-pulse{0%,to{transform:scale(.8);opacity:.4}50%{transform:scale(1.2);opacity:1}}.pagination-container{position:relative;min-height:50px;display:flex;justify-content:center;align-items:center;margin:20px 0}.loader-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.loader-fixed-height{height:50px;display:flex;align-items:center;justify-content:center}.top-loader-container{position:fixed;top:0;left:0;width:100%;height:3px;z-index:9999;background-color:#ffffff1a;overflow:hidden}.top-loader-bar{width:100%;height:100%;background-color:#2563eb;animation:loading-bar 1.5s infinite ease-in-out;transform-origin:0% 50%}@keyframes loading-bar{0%{transform:translate(-100%)}50%{transform:translate(-30%)}to{transform:translate(100%)}}.event-index header{display:flex;align-items:center;justify-content:space-between;padding-block:.3em}.event-index h2{margin:0;font-size:1.3em}.event-index button{margin:0}.event-index .btn-pagination{border:1px solid var(--border-gray);border-radius:2em;padding:.5em 1em;font-size:.9em;font-weight:600}.event-index .btn-pagination:hover{background-color:var(--input-gray)}.event-list{--min-column-size: 250px;margin-top:1em;display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--min-column-size),1fr));gap:1em}.event-list li{position:relative;border-radius:7.2px;background-color:var(--pt-white);padding:.5em;border:1px solid var(--border-gray);height:180px;box-shadow:0 2px 5px -1px #0000000d;transition:box-shadow .2s ease-in-out,transform .2s ease-in-out}.event-list li:hover{box-shadow:0 4px 8px -2px #0000001a;transform:translateY(-1px)}.event-preview{display:grid;grid-template-rows:60px 80px 20px;min-height:160px;height:auto;header {margin-inline-start: 2px; grid-row: 1; align-self: start;} main {grid-row: 2/3; align-self: end; margin-bottom: 4px;} .event-info {display: flex; align-items: flex-start; gap: 12px; width: 100%;} img {width: 38px; height: 38px; border-radius: 7.2px; object-fit: cover; flex-shrink: 0; margin-top: 2px;} .event-title {flex-grow: 1; font-size: .9em; line-height: 1.3; color: var(--text-main); overflow: visible; &:hover {cursor: pointer; text-decoration: underline;}} .odds {flex-shrink: 0; width: 60px; height: 40px; display: flex; justify-content: flex-end; align-items: center; margin-inline-start: 8px;} .odds-info {position: absolute; top: 26px; right: 15.5px; display: flex; flex-direction: column; align-items: center; .number {font-weight: 400;} .text {font-weight: 400; font-size: .9em; color: var(--pt-gray)}}}.options{display:flex;margin-top:8px;width:100%}.option{display:flex;width:100%;justify-content:space-between;align-items:center;grid-template-columns:50px 1fr;margin-block-end:8px}.option .option-name{font-family:izmir}.option .option-name:hover{cursor:pointer;text-decoration:underline}.action-btn{cursor:pointer;font-size:1.1em;color:var(--pt-white);background-color:var(--button-blue);padding:10px 16px;border-radius:7.2px;min-width:max-content;flex:1}.action-btn.yes{background-color:var(--button-green);color:var(--button-green-hover)}.action-btn.yes:hover{background-color:var(--button-green-hover);color:var(--pt-white)}.action-btn.no{background-color:var(--button-red);color:var(--button-red-hover)}.action-btn.no:hover{background-color:var(--button-red-hover);color:var(--pt-white)}.action-btn:hover{background-color:var(--button-blue-hover)}.action-btn:active{transform:scale(.97)}.binary-options{display:flex;width:100%;justify-content:space-between;gap:8px;padding-inline:3px;margin-bottom:8px}.market-btns{font-size:.8em;gap:5px}.market-btns .action-btn{padding:6px 12px}.multi-options{width:100%;height:72px;overflow:scroll;overflow-y:auto;overflow-x:hidden}.option-name{font-weight:400;font-size:.85em}.btn-group{display:flex;align-items:center;flex:1}footer{font-family:izmir;font-size:.8em;font-weight:400;color:var(--pt-gray);justify-content:space-between;width:100%;grid-row:3;align-items:end;div {width: 100%;} span {font-size: 1.3em; transform: translate(-6px,4px); :hover {cursor: pointer; background-color: var(--border-gray); outline: var(--border-gray) solid 5px; border-radius: 50%;}}}.price-label{margin-right:4px;font-family:izmir-medium;font-size:1.1em}.btn-group:has(.sport){flex-direction:column}.action-btn.sport{width:100%;color:var(--sport-button-blue-hover);background-color:var(--sport-button-blue);padding:8px 12px;overflow:hidden;text-overflow:ellipsis}.action-btn.sport:hover{background-color:var(--sport-button-blue-hover);color:var(--pt-white)}.action-btn.sport .btn-text{font-size:clamp(.5rem,80%,1rem);display:inline-block;white-space:wrap;max-width:105px}.btn-group:has(.sport):nth-child(2) .action-btn{background-color:var(--sport-button-orange);color:var(--sport-button-orange-hover)}.btn-group:has(.sport):nth-child(2) .action-btn:hover{background-color:var(--sport-button-orange-hover);color:var(--pt-white)}ul.filter-carusel{margin:1fr;gap:1em;justify-content:space-between;font-family:izmir;display:flex;gap:1.5em;overflow-x:auto;padding-bottom:10px;white-space:nowrap;scrollbar-width:none;align-items:center;font-size:.9em;font-weight:480;transition:mask-image .3s ease,-webkit-mask-image .3s ease;--mask-left: black;--mask-right: black;mask-image:linear-gradient(to right,var(--mask-left),black 10%,black 90%,var(--mask-right));-webkit-mask-image:linear-gradient(to right,var(--mask-left),black 10%,black 90%,var(--mask-right));li:hover {color: var(--pt-black2);} li.active {color: var(--button-blue-hover); background-color: var(--button-blue-light); padding: .5em .6em; border-radius: 7.2px;}}ul.filter-carusel::-webkit-scrollbar{display:none}ul.filter-carusel.scrolled-left{--mask-left: transparent}ul.filter-carusel.scrolled-right{--mask-right: transparent}ul.filter-carusel>*{cursor:pointer;display:flex;gap:.5em;align-items:center;color:var(--pt-gray);flex-shrink:0}.filter-carusel::-webkit-scrollbar{display:none}.filter-icons{display:flex;font-size:1.3em;gap:8px}.filter-icons>*{height:35px}.filter-icons>*:hover{background-color:var(--border-gray);border-radius:7.2px;cursor:pointer}.filter-icons>*:hover:hover{color:var(--pt-black2);background-color:var(--border-gray)}.icon-wrapper{display:flex;align-items:center;justify-content:center;width:35px;height:35px;border-radius:7.2px}.icon-wrapper:hover{color:var(--pt-black2);background-color:var(--border-gray)}.icon-wrapper:has(.full),.icon-wrapper.full{background-color:var(--border-gray)}.filter-icons .search-container{display:flex;align-items:center;position:relative;width:30px;transition:width .5s ease;overflow:hidden;input {position: absolute; left: 0; width: 100%; padding: 0; border: 1px solid var(--border-gray); border-radius: 7.2px; background-color: var(--input-gray); opacity: 0; pointer-events: none; transition: all .5s ease; height: 35px;} input:focus {outline: 1px solid var(--border-gray); border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-color: var(--input-gray);} .search-icon {z-index: 1; position: absolute; left: 5px;} &.open {width: 200px; &:hover {background-color: transparent; outline: none;} input {opacity: 1; padding-inline-start: 2.1em; pointer-events: auto;} .search-icon {z-index: 1; left: 5px; color: var(--pt-gray);}}}.sort-field-select{display:flex;gap:.5em;width:max-content;height:max-content;padding:.8em;border-radius:2em}.radix-item{display:flex;align-items:center;gap:.5em;border-radius:7.2px;cursor:pointer}.radix-item:hover{background-color:var(--border-gray);color:var(--pt-black2)}.radix-item[data-state=checked]{background-color:var(--button-blue-light);color:var(--button-blue-hover)}.event-details{flex:2;margin:1em;display:grid;position:relative}.event-details .event-info{display:flex;align-items:center;gap:1em;width:100%;img {width: 64px; height: 64px; object-fit: cover; border-radius: 7.2px;}}.event-details .options{gap:.8em;margin-top:1em;flex-wrap:wrap}.event-details{margin:1em;display:grid;position:relative}.event-details .event-info{gap:1em;img {width: 64px; height: 64px; object-fit: cover; border-radius: 7.2px;}}.event-details .event-labels{font-family:izmir-medium;color:var(--pt-gray);font-size:.9em;margin-bottom:.5em;display:flex;gap:1em}.event-details .event-label:first-child{position:relative}.event-details .event-label:first-child:after{position:absolute;content:"•";margin-left:.35em}.event-details .inner-info a{font-size:1.25em}.event-details .options{gap:.8em;margin-top:1em}.event-details .options .market{cursor:pointer;font-family:izmir-medium;font-size:1.1em;border-radius:2em;background-color:var(--input-gray);padding:.5em 1em}.event-details .options .market.active{background-color:var(--pt-black2);color:var(--pt-white)}.chart-container{position:relative;margin-top:1.5em}.chart-wrapper-fixed{width:100%;height:300px;position:relative;margin-top:1.5em}.chart-wrapper-fixed canvas{width:100%!important}.event-details .controls{display:flex;justify-content:space-between;margin-top:1em;color:var(--pt-gray)}.event-details .controls .buttons{margin-inline-end:1em;cursor:pointer;display:flex;gap:1em}.event-details .controls .buttons .active{color:var(--pt-black2);font-weight:700}.comments-section{margin-top:2rem;padding:1rem;border-top:1px solid #e5e7eb;h3 {font-size: 1.25rem; margin-bottom: 1.5rem; color: #111827;}}.comment-card{gap:12px;margin-bottom:20px;align-items:flex-start}.user-avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:14px;text-shadow:0px 1px 2px rgba(0,0,0,.2)}.user-img{width:32px;height:32px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:14px;text-shadow:0px 1px 2px rgba(0,0,0,.2)}.comment-content{background-color:#f9fafb;padding:12px 16px;border-radius:12px;flex-grow:1}@media (max-width: 650px){.comment-content{max-width:250px}}.comment-content .comment-header{align-items:center;gap:8px;margin-bottom:4px}.comment-content .comment-header .user-name{font-weight:600;font-size:.9rem;color:var(--pt-black)}.comment-content .comment-header .comment-date{font-size:.75rem;color:var(--pt-gray)}.comment-content .comment-text{font-family:izmir-light;font-size:.9em;line-height:1.5;color:var(--pt-black2);margin:0}.trading-section{width:400px;height:max-content;position:sticky;top:156px;background-color:var(--pt-white);border:1px solid var(--border-gray);border-radius:15.2px;margin:2em;flex:1;box-shadow:3px 2px 12px 2px #0000000d;header {border-bottom: 1px solid var(--border-gray); padding: .5em .5em 0em 1em; justify-content: space-between;} .trading-dirs {cursor: pointer; gap: 1em; color: var(--pt-gray); .active {position: relative; color: var(--pt-black2);} .active::after {position: absolute; content: ""; width: 100%; height: 2px; background-color: var(--pt-black2); bottom: -15px; left: 0;}} .trading-select.radix-trigger {cursor: pointer; border: none; gap: 3px; justify-content: end;} .trading-buttons {display: flex; padding: 1em; margin: 0; .trading-button {flex: 1; padding: .8em; border-radius: 9.2px; border: none; color: var(--pt-white); font-size: 1.1em; cursor: pointer;} .trading-button.yes.active {background-color: var(--button-green-hover); color: var(--gray-text-button); span {color: var(--pt-white);}} .trading-button {background-color: var(--input-gray); color: var(--pt-gray);} .trading-button.no.active {background-color: var(--button-red-hover); color: var(--pt-white); span {color: var(--pt-white);}} .trading-button:hover:not(.active) {background-color: var(--pt-gray-lighter); color: var(--pt-gray-light);} .trading-button.no.sport {background-color: var(--sport-button-orange); color: var(--sport-button-orange-hover); &:hover {background-color: var(--sport-button-orange-hover); color: var(--pt-gray-lighter);} &.active {background-color: var(--sport-button-orange-hover); color: var(--pt-gray-lighter);}} .trading-button.yes.sport {background-color: var(--sport-button-blue); color: var(--sport-button-blue-hover); &:hover {background-color: var(--sport-button-blue-hover); color: var(--pt-gray-light);} &.active {background-color: var(--sport-button-blue-hover); color: var(--pt-gray-light);}}} .market-order {justify-content: space-between; padding-inline: 1.5em; margin-bottom: 1em; height: 43px; input {width: 70%; border: none; font-size: 2em; text-align: end;} input:focus {outline: none;} h4 {margin-bottom: 0;} h6 {width: max-content; color: var(--pt-gray);}} .money-btns {display: flex; justify-content: end; margin: 1.3em;} .money-btn {margin: 3px; padding: .4em .8em; border-radius: 7.2px; border: 1px solid var(--border-gray); font-size: .83em; font-family: izmir-medium; cursor: pointer; &:hover {background-color: var(--pt-gray-hover);}} .order-input-wrapper {position: relative; display: flex; align-items: center; &::before {content: "$"; position: absolute; left: 10px; z-index: 1; pointer-events: none; font-size: 1rem; color: var(--pt-black2);}} footer {height: fit-content; .button-wrapper {height: 70px;}} .place-order-btn {appearance: button; background-color: var(--special-button-blue); border: solid transparent; border-radius: 9.2px; border-width: 0 0 6px; box-sizing: border-box; color: #FFFFFF; cursor: pointer; display: inline-block; font-family: izmir-medium; font-size: 1.3em; letter-spacing: .9px; line-height: 20px; margin: 0; outline: none; overflow: visible; padding: 13px 16px; text-align: center; touch-action: manipulation; transform: translateZ(0); transition: filter .2s; user-select: none; -webkit-user-select: none; vertical-align: middle; white-space: nowrap; width: 90%; margin-inline-start: 5%; margin-bottom: 1em; ;} .place-order-btn:after {background-clip: padding-box; background-color: var(--button-blue); border: solid transparent; border-radius: 9.2px; border-width: 0 0 4px; bottom: -4px; content: ""; left: 0; position: absolute; right: 0; top: 0; z-index: -1;} .place-order-btn,.place-order-btn:focus {user-select: auto;} .place-order-btn:hover:not(:disabled) {filter: brightness(1.1); -webkit-filter: brightness(1.1);} .place-order-btn:disabled {cursor: auto;} .place-order-btn:active {transform: translateY(2px); border-width: 0 0 4px;} .place-order-btn:active:after {border-width: 0 0 0; bottom: 0;}}.order-summary{height:0px;opacity:0;border-top:2px solid var(--input-gray);justify-content:space-between;padding-inline:.2em;padding-top:1em;margin-inline-start:5%;transition:height .3s ease,opacity .3s ease;width:90%;h2 {text-align: start; font-family: izmir-medium; color: var(--pt-black2);} .money-icon {translate: 2px 3px;} .to-win {font-size: 2em; text-align: end; color: var(--to-win-green);}}.order-summary.open{height:70px;opacity:1;margin-bottom:1em}.order-summary:has(.limit).sell.open{height:40px}.order-summary:has(.limit).open{margin-bottom:2em}.limit-order{justify-content:space-between;margin-inline:1.5em;align-items:center;border-bottom:2px solid var(--input-gray);padding-bottom:1em;h4 {margin-bottom: 2px;} .limit-btn {cursor: pointer; font-family: izmir-light; font-size: 1.2em;}}.limit-input{justify-content:space-between;width:120px;align-items:center;border:1px solid var(--border-gray);border-radius:9.2px;padding:.5em 1em;input {width: 65px; border: none; font-size: 1.2em; text-align: center;} input:focus {outline: none;}}.trading-section .shares{justify-content:space-between;align-items:center;margin:1.5em;input {text-align: end; border: 1px solid var(--border-gray); border-radius: 9.2px; padding: .5em 1em; width: 123px; font-size: 1.2em;} input:focus {outline: 1px solid var(--border-gray);}}.money-btn.gradient{background:linear-gradient(92.41deg,#1652f0 2.15%,#9b51e0 92.62%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;display:inline-block}.limit-summary{text-align:end;margin-bottom:2em;height:fit-content}.total{font-size:1.5em;text-decoration:underline;text-decoration-style:dashed;text-underline-offset:5px;color:var(--button-blue);margin-bottom:2px}.money-icon.limit{translate:0px -1px}.long-txt{font-family:izmir-light;line-height:1.5;font-size:.85em;button {margin: 0 1em 0 0; padding: 0; color: var(--pt-gray);}}.comment-content .delete-icon{cursor:pointer;color:var(--pt-gray);translate:0px 2px;margin-inline-start:auto}.comment-content p{margin-right:20px}.add-comment{position:relative;margin-bottom:1.5em;button {font-family: izmir-medium; position: absolute; right: 3px; padding: .4em .8em .6em .8em; font-size: 1em;} button:disabled {cursor: auto; background-color: var(--faded-blue);}}.add-comment input{width:100%;border:1px solid var(--border-gray);border-radius:9.2px;padding:1em;font-size:1em}.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both;transform:translateZ(0)}@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}.avg-price-display{font-size:.9em}.ticker-display{--number-flow-char-width: 1ch;font-variant-numeric:tabular-nums;font-weight:600}.current{display:flex;align-items:center;font-size:1.5em;color:var(--button-blue-hover);height:1.5em}.price-change-badge{transition:color .2s ease,background-color .2s ease}.sticky-header{position:sticky;top:118px;background-color:var(--pt-white);z-index:10;padding-top:1em;padding-bottom:1em;min-height:85px;display:flex;align-items:center;width:100%}@media (max-width: 650px){.sticky-header{top:100px;padding-bottom:0}}.sticky-header:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:var(--border-gray);opacity:var(--border-opacity, 0);transition:opacity .1s ease}.header-content-wrapper{width:100%;display:flex;align-items:center}@media (max-width: 650px){.trading-section{position:fixed;top:auto;bottom:61px;left:0;right:0;width:100%;z-index:999;border-radius:16px 16px 0 0;margin:0;overflow:hidden;max-height:95px;transition:max-height .3s ease}.trading-section.drawer-open{max-height:90dvh;overflow-y:auto}.trading-section.drawer-closed{cursor:pointer;header,footer,.money-btns,.market-order,.order-summary,.limit-order,.shares {display: none;}}.trading-select{position:relative;right:50px}}button.drawer-close{display:none}@media (max-width: 650px){.drawer-close{position:absolute;top:8px;right:12px;background:none;border:none;font-size:1.1rem;cursor:pointer;color:var(--clr-text);opacity:.6}button.drawer-close{display:block}}@media (max-width: 650px){.event-details-page{padding-bottom:60px}}.event-details-page.drawer-open{padding-bottom:50dvh}@media (max-width: 650px){.trading-section{width:100%!important;box-sizing:border-box}.event-details-page{flex-direction:column;max-width:100vw}.event-details{width:100%;margin:0;box-sizing:border-box;padding:0 1em}}.comment-text,.user-name{word-break:break-word;overflow-wrap:break-word}.search-page{margin-top:1em;display:flex;gap:2em}.search-page .header{margin-inline-start:.8em;font-family:izmir;color:var(--pt-gray);span {color: var(--pt-black)}}.search-results{min-width:50vw;flex:2.5;p {font-family: izmir; color: var(--pt-gray); text-align: center; margin: 5em auto;}}.search-results-list{display:grid;position:relative}.search-results-list .event-info{gap:1em;img {width: 56px; height: 56px; object-fit: cover; border-radius: 7.2px;}}.search-result-item{position:relative;padding:.8em;border-radius:7.2px}.search-result-item:hover{background-color:var(--input-gray)}.search-result-item .event-title{margin-bottom:.5em}.search-result-item .event-title:hover{text-decoration:underline}.search-result-item .event-labels{font-family:izmir;color:var(--pt-gray);font-size:.8em;margin-bottom:.5em;display:flex;gap:1em}.search-result-item .event-label:first-child{position:relative}.search-result-item .event-label:first-child:after{position:absolute;content:"•";margin-left:.35em}.search-result-item .volume{font-family:izmir;color:var(--pt-gray);font-size:.8em}.search-result-item .inner-info{flex:1}.search-result-item .odds{text-align:right;display:flex;flex-direction:column;justify-content:center}.search-result-item .odds .price{font-family:izmir;font-size:1.2em}.search-result-item .odds .outcome{font-family:izmir;color:var(--pt-gray);font-size:1em}.search-result-item .icon.arrow{rotate:270deg;align-self:center}.search-result-item:after{content:"";position:absolute;left:20px;bottom:-1px;width:97%;height:1px;background-color:var(--border-gray)}.search-sticky-menu{position:sticky;flex:1;width:350px;height:max-content;top:150px;background-color:var(--pt-white);border:1px solid var(--border-gray);border-radius:7.2px;box-shadow:3px 2px 12px 2px #0000000d;margin-inline-start:auto}@media (max-width: 650px){.search-sticky-menu{display:none}}.search-form{position:relative;width:100%;input {padding-inline-start: 2.5em; width: 100%; height: 50px; border: none; border-bottom: 1px solid var(--border-gray); border-top-left-radius: 7.2px; border-top-right-radius: 7.2px;} input:focus {outline: none;} .icon.search {position: absolute; left: 10px; top: 50%; transform: translateY(-50%);}}.sorting-options{gap:.5em;flex-wrap:wrap}.sort-by.header{margin:1em;font-family:izmir;color:var(--pt-gray)}.sort-item{cursor:pointer;gap:.5em;padding:.5em;border-radius:7.2px;font-family:izmir;color:var(--pt-blac2);font-size:.9em}.sort-item:hover{background-color:var(--input-gray);color:var(--pt-black)}.sort-item.active{background-color:var(--pt-gray-light)}@media (max-width: 650px){.search-results .header{margin-top:1em}}@media (min-width: 651px){.search-container.narrow-screen{display:none}}.order-book.container{margin-block:1em;border:1px solid var(--border-gray);border-radius:15.2px;overflow:hidden;width:99%}.order-book.container .order-book-header{justify-content:space-between;align-items:center;padding:1em;cursor:pointer;border-radius:15.2px}.order-book.container .order-book-header:hover{background-color:var(--pt-gray-lighter)}.order-book.container .order-book-header .order-book-title{font-size:1.1em;margin-bottom:4px}.order-book.container .order-book-header .btn-toggle{transform:scale(1.2);transition:transform .4s}.order-book.container .order-book-header .arrow{transition:transform .4s}.order-book.container .order-book-header .arrow.open{transform:rotate(-180deg)}.order-book.container .inner-selector .icon-wrapper{margin-inline-start:auto;cursor:pointer;width:25px;height:25px}.order-book.container .inner-selector .icon-wrapper .refresh-icon.loading{rotate:45deg;color:var(--pt-gray)}.order-book.container.open .order-book-header{border-bottom:1px solid var(--border-gray);border-bottom-right-radius:0;border-bottom-left-radius:0}.order-book.container .inner-selector{padding:1em;font-size:.8em;font-family:izmir-semibold,sans-serif;color:var(--pt-gray);gap:1em;span {cursor: pointer;} .active {color: var(--pt-black2);}}.order-book.container .table-header{margin-top:1em;display:grid;grid-template-columns:40% 20% 20% 20%;font-size:.7em;font-family:izmir,sans-serif;color:var(--pt-gray);border-bottom:1px solid var(--border-gray)}.order-book.container .table-header .uppercase{margin-inline-start:1em}.order-book.container .table-header .trade-header{display:flex;align-items:center;gap:8px}.order-book.container .table-header .trade-header .center-icon{cursor:pointer}.order-book.container .table-header .trade-header .icon-wrapper{width:23px;height:23px}.order-book.container .row{display:grid;grid-template-columns:40% 20% 20% 20%;font-size:.85rem;height:28px}.order-book.container .side{position:relative;background-repeat:no-repeat;background-position:left;transition:background-size .3s ease-out}.order-book.container .side.sell{background-image:linear-gradient(to right,rgba(255,80,80,.15),rgba(255,80,80,.15))}.order-book.container .side.buy{background-image:linear-gradient(to right,rgba(56,164,30,.15),rgba(30,166,75,.15))}.order-book.container .side{width:100%;font-size:.7rem}.order-book.container .ask-row .price{color:var(--button-red-hover)}.order-book.container .bid-row .price{color:var(--button-green-hover)}.order-book.container .row .shares,.order-book.container .total-in-row{font-variant-numeric:tabular-nums;font-family:izmir-light,sans-serif}.order-book.container .order-book-table{height:320px;overflow-y:auto;position:relative;display:flex;flex-direction:column}.order-book.container .center-divider{border-block:1px solid var(--border-gray);font-size:.8em;color:var(--pt-gray);padding:.6em;position:sticky;top:-1px;bottom:-1px;background-color:var(--pt-white);display:flex;justify-content:center;z-index:1;display:grid;grid-template-columns:40% 20% 20% 20%}.order-book.container .center-divider:first-child{text-align:start}.order-book.container .order-book-main{height:0;transition:.2s ease-out}.order-book.container.open .order-book-main{height:397px}.empty-state{margin:1em}.portfolio.container{margin-top:1em}.position-raw,.positions-header{display:grid;grid-template-columns:30% repeat(7,1fr);gap:10px;border-bottom:1px solid var(--border-gray);max-height:min-content}.position-raw{position:relative;color:var(--pt-black2);font-family:izmir-light,sans-serif;padding:.5em 0}.position-raw:nth-child(2n){background-color:var(--pt-gray-hover)}.position-raw:nth-child(odd){background-color:var(--pt-gray-text-button)}.position-raw .event-name{cursor:pointer}.position-raw .event-name:hover{text-decoration:underline}.position-raw .sell-btn{position:absolute;right:10px;top:5px;padding:4px 8px;background-color:var(--button-red);color:var(--pt-black2);border-radius:4px;font-size:.8em;cursor:pointer}.position-raw .sell-btn:hover{background-color:var(--button-red-hover);color:var(--pt-white)}.positions-header{margin-top:1em;padding-bottom:.2em;border-bottom:1px solid var(--border-gray);font-size:.8em;color:var(--pt-gray)}.positions-list{display:grid}.empty-portfolio{text-align:center;color:var(--pt-gray);margin-top:2em}.portfolio-top-layout{width:100%;background:#fff;padding:30px;border-radius:20px;border:1px solid #edf0f2;box-shadow:0 4px 20px #00000005;margin-bottom:40px;display:flex;flex-direction:column;gap:20px}.summary-card{display:flex;flex-direction:column;gap:4px}.label-main{font-size:14px;color:#6d7278;font-weight:500}.equity-value{font-size:42px;font-weight:700;color:#000;letter-spacing:-1px}.pnl-badge-modern{margin-top:8px;display:inline-flex;align-items:center;padding:4px 12px;border-radius:20px;font-weight:600;width:fit-content;font-size:14px}.pnl-badge-modern.pos{background:#e6f6ef;color:#00aa5d}.pnl-badge-modern.neg{background:#fdeaea;color:#ff4d4d}.chart-wrapper{width:100%;height:250px;position:relative}.time-filters{display:flex;justify-content:center;gap:12px;padding-top:15px;border-top:1px solid #f1f3f5;position:relative;z-index:10}.filter-btn{background:#f4f6f8;border:none;padding:6px 16px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;color:#5f6673;transition:.2s}.filter-btn.active{background:#000;color:#fff}.recharts-wrapper,.recharts-surface{outline:none;-webkit-tap-highlight-color:transparent}.recharts-layer:focus{outline:none}.recharts-wrapper *,.recharts-surface,.recharts-surface *,.recharts-responsive-container,svg{outline:none!important;box-shadow:none!important;-webkit-tap-highlight-color:transparent}.recharts-wrapper:focus,.recharts-surface:focus,.recharts-layer:focus{outline:none!important}.portfolio .deposit-btn{padding:.5em .8em;font-size:revert}.positions.container{padding-inline:.5em}.review-edit{display:flex;align-items:center;justify-content:space-between;gap:.5em;padding-block-end:1em;border-block-end:1px solid var(--gray2)}.review-edit>*{height:2em}.review-edit textarea{flex-grow:1;font-family:inherit}.review-list{--min-column-size: 220px;display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--min-column-size),1fr));gap:.5em}.review-list .actions button{padding:.3em .5em;float:right}.review-preview{padding:.5em;background-color:var(--clr3);color:var(--gray1)}.review-preview .review-txt{padding:.4em;background-color:var(--gray4);color:var(--gray1);border-left:1em solid var(--gray1);font-size:1.2em}
