                                                                      
                             
                                                                      
                                                           
                                                                    
                                                                        
                                                                     
                        
                                                                       

.sss{
  padding-block: var(--blm-pd); background: var(--z1);
                                                                         
                                                                      
                                                                  
                                                           
                                                                       
                                                 
  --sss-nav-serit: calc(var(--cerceve) + var(--nav-h) + 2px);
  --sss-art-w: 1.1rem;                                        
}

                        
                                                                  
                                                                          
                                                                    
                                                                
.sss-bas{ margin-block-end: var(--bo-2); }
.sss-bsl{
  font-family: "Manrope", ui-sans-serif, system-ui, sans-serif; font-weight: 800; margin: 0;
  font-size: var(--blm-bsl); line-height: 1.1; letter-spacing: -.035em;
}
html[lang="ar"] .sss-bsl{ font-family: "Noto Kufi Arabic", sans-serif; letter-spacing: 0; line-height: 1.4; }

                                  
                                                                            
                                                                           
                                                                 
                                                                       
                                                       
.sss-iz{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  column-gap: var(--bo-4);
  align-items: start;
}
.sss-bas{ grid-column: 1; grid-row: 1; }
                                                              
                                                         
.sss-sol{ grid-column: 1; grid-row: 2; }
.sss-liste{ grid-column: 2; grid-row: 1 / span 2; }
@media (max-width: 64rem){
  .sss-iz{
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    row-gap: var(--bo-3);
  }
  .sss-bas, .sss-sol, .sss-liste{ grid-column: 1; grid-row: auto; }
}

                                                 
                                                                       
                                                                      
                                                                       
                                                                     
                          
.sss-sol{
  position: sticky;
                                                                   
                                                                  
                                                      
  inset-block-start: calc(var(--sss-nav-serit) + var(--bo-2));
  display: flex; flex-direction: column; gap: var(--bo-2);
}
                                                                       
                                                                  
                                                                          
                                                                          
.sss-bot{
  display: flex; flex-direction: column;
  background: var(--ar-kap-zem, var(--z2));
  border: var(--ar-kap-knr, 1px) solid var(--cizgi);
  border-radius: var(--ar-r-kap, var(--yr-l));
  overflow: hidden;
}
@media (max-width: 64rem){
  .sss-sol{ position: static; }
}

.sss-bot-bas{
  display: flex; align-items: center; gap: .6rem;
  padding: calc(var(--bo-1) * .8) var(--kart-pd);
  border-block-end: 1px solid var(--cizgi2);
  background: var(--z3);
}
.sss-nokta{
  inline-size: .5rem; block-size: .5rem; border-radius: var(--yr-tam);
  background: var(--aksan); flex: none;
}
.sss-bot-ad{
  font-size: var(--yz-dgm); font-weight: 700; color: var(--mrk);
  flex: 1 1 auto; min-inline-size: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
                                                                 
                                                                         
                                                                      
                                                                
                                                                      
                                                                         
.sss-bot-dur{
  font-size: var(--yz-etk); font-weight: 500; letter-spacing: .12em;
  text-transform: uppercase; color: var(--mrk); flex: none;
}
html[lang="ar"] .sss-bot-dur{ letter-spacing: 0; text-transform: none; }

                                                                 
.sss-akis{
  padding: var(--kart-pd);
  display: flex; flex-direction: column; gap: var(--bo-1);
  block-size: clamp(19rem, 34vh, 25rem);
  overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin;
}

                                                                         
                                                                   
                                                                        
.sss-bos[hidden]{ display: none; }
.sss-bos{
  margin: auto 0; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: .75rem;
  padding-inline: var(--bo-1);
}
                                                                         
                                                                           
                                                                        
                               
.sss-bos-ik{ inline-size: 2.25rem; block-size: 2.25rem; color: var(--mrk2); opacity: .8; }
.sss-bos-yzi{
  margin: 0; font-size: var(--yz-kck); line-height: var(--sy-gvd);
  color: var(--mrk2); max-inline-size: 34ch;
}

              
.sss-balon{
  max-inline-size: 88%;
  padding: .65rem .95rem;
  border-radius: var(--yr-m);
  font-size: var(--yz-kck); line-height: var(--sy-gvd);
  align-self: start;
  background: var(--z1); color: var(--mrk2);
  border: 1px solid var(--cizgi2);
  border-start-start-radius: var(--yr-s);
}
                                                                        
                                                                              
.sss-balon[data-sss-kim="ben"]{
  align-self: end;
  background: var(--mrk); color: var(--z1);
  border-color: transparent;
  border-start-start-radius: var(--yr-m);
  border-start-end-radius: var(--yr-s);
}
.sss-balon p{ margin: 0; }
.sss-balon p + p{ margin-block-start: .5rem; }

                                                                     
                                                                         
.sss-balon-bag{
  display: inline-flex; align-items: center; gap: .35rem;
  margin-block-start: .55rem;
  font-size: var(--yz-kck); font-weight: 700; color: var(--toprak-mtn);
  border-block-end: 1px solid currentColor; padding-block-end: 1px;
}

               
.sss-dusun{ display: inline-flex; gap: .25rem; align-items: center; padding-block: .2rem; }
.sss-dusun i{
  inline-size: .3rem; block-size: .3rem; border-radius: var(--yr-tam);
  background: currentColor; opacity: .35;
  animation: sss-nabiz 1.05s var(--egri) infinite;
}
.sss-dusun i:nth-child(2){ animation-delay: .16s; }
.sss-dusun i:nth-child(3){ animation-delay: .32s; }
@keyframes sss-nabiz{ 0%, 70%, 100%{ opacity: .3 } 35%{ opacity: .95 } }

                  
.sss-giris{
  display: flex; align-items: center; gap: .4rem;
  padding: calc(var(--bo-1) * .7) calc(var(--kart-pd) * .7);
  border-block-start: 1px solid var(--cizgi2);
  background: var(--z1);
}
.sss-alan{
  flex: 1 1 auto; min-inline-size: 0;
  background: transparent; border: 0; outline: 0;
  padding: .55rem .7rem;
  font-size: var(--yz-dgm); color: var(--mrk);
}
.sss-alan::placeholder{ color: var(--mrk2); opacity: 1; }
.sss-gnd{
                                                                         
                                                                           
                      
  flex: none; inline-size: 2.75rem; block-size: 2.75rem;
  display: grid; place-items: center;
  border: 0; border-radius: var(--yr-tam); cursor: pointer;
  background: var(--aksan); color: var(--z1);
  transition: background-color var(--mikro) var(--egri), opacity var(--mikro) var(--egri);
}
.sss-gnd svg{ inline-size: 1.05rem; block-size: 1.05rem; }
html[dir="rtl"] .sss-gnd svg{ transform: scaleX(-1); }
.sss-gnd:disabled{ opacity: .35; cursor: default; }
@media (hover: hover){ .sss-gnd:not(:disabled):hover{ background: var(--mrk); } }

                                                      
                                                                           
                                                                    
                                                                        
                                                                       
.sss-liste{ border-block-start: 0; }
.sss-oge{ border-block-end: 1px solid var(--cizgi2); }
.sss-oge:last-child{ border-block-end: 0; }

.sss-h{ margin: 0; font-size: inherit; font-weight: inherit; }
                                            
                                                                          
                                                                      
                                                                         
                                                                          
.sss-soru{
  inline-size: 100%;
  display: grid;
                                                                          
                              
                                                                             
                                                                             
                                                                              
                                                           
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  column-gap: var(--bo-1);
  background: transparent; border: 0; cursor: pointer;
  padding: var(--bo-2) 0;
  text-align: start;
  font-size: var(--yz-alt); font-weight: 700; line-height: 1.32;
  letter-spacing: -.015em; color: var(--mrk);
  transition: color var(--mikro) var(--egri);
}
.sss-soru-yzi{ min-inline-size: 0; }
@media (hover: hover){ .sss-soru:hover{ color: var(--toprak-mtn); } }


                                                                     
                                                                    
                                                                   
.sss-art{
  flex: none; inline-size: var(--sss-art-w); block-size: var(--sss-art-w);
  display: grid; place-items: center;
  color: var(--mrk3);
  align-self: center;
  transition: transform var(--gecis) var(--egri), color var(--mikro) var(--egri);
}
.sss-art svg{ inline-size: var(--sss-art-w); block-size: var(--sss-art-w); }
.sss-soru[aria-expanded="true"] .sss-art{
  transform: rotate(45deg);
  color: var(--toprak-mtn);
}
@media (hover: hover){ .sss-soru:hover .sss-art{ color: var(--mrk2); } }

                                                  
                                                                         
                                                                         
                                                                           
                                                                     
                                                                       
                                                                          
                                                                        

                                                                    
                                                                  
                                                                          
                                                                       
                                                 
html[dir="rtl"] .sss-soru{
  grid-template-columns: minmax(0, 1fr) auto;
}
html[dir="rtl"] .sss-soru-yzi{ grid-column: 1; }
html[dir="rtl"] .sss-art{ grid-column: 2; }
                                                                            
html[dir="rtl"] .sss-cvp-yzi,
html[dir="rtl"] .sss-eyl{
  padding-inline-start: 0;
}

                                                                         
                                                                         
                                                                       
                                                                        
                                           
                                                                     
                                                                 
                                                     
.sss-cvp{
  display: grid;
  grid-template-rows: 0fr;
  visibility: hidden;
  transition: grid-template-rows var(--gecis) var(--egri),
              visibility 0s linear var(--gecis);
}
.sss-cvp[data-acik]{
  grid-template-rows: 1fr;
  visibility: visible;
  transition: grid-template-rows var(--gecis) var(--egri), visibility 0s;
}
                                                                            
                                                                          
.sss-cvp-ic{ overflow: hidden; min-block-size: 0; }
                                                                          
.sss-cvp-ic > :last-child{ margin-block-end: var(--bo-2); }
                                                                         
                                                                         
                                          
.sss-cvp-yzi, .sss-eyl{
  padding-inline-start: calc(var(--sss-art-w) + var(--bo-1));
}
                                   
                                                                    
                                                                       
                                                                   
                                                                     
                                     
                                                                  
                                                          
                                                                      
                                                                     
.sss-cvp-yzi{
  margin: 0;
  font-size: var(--yz-gvd); line-height: var(--sy-gvd); color: var(--mrk2);
}
.sss-eyl{
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem var(--bo-1);
  margin-block-start: var(--bo-1);
}
.sss-ilet{
  display: inline-flex; align-items: center; gap: .4rem;
  min-block-size: 2.75rem;                                                        
  padding: .42rem .95rem;
  background: var(--z2); color: var(--mrk); border: 1px solid var(--cizgi2);
  border-radius: var(--yr-tam); cursor: pointer;
  font-size: var(--yz-kck); font-weight: 700;
  transition: background-color var(--mikro) var(--egri), color var(--mikro) var(--egri);
}
.sss-ilet-ik{ inline-size: .8rem; block-size: .8rem; flex: none; }
html[dir="rtl"] .sss-ilet-ik{ transform: scaleX(-1); }
@media (hover: hover){ .sss-ilet:hover{ background: var(--mrk); color: var(--z1); } }
.sss-ilet[data-yollandi]{ background: var(--mrk); color: var(--z1); }

.sss-bag{
  display: inline-flex; align-items: center; gap: .35rem;
  min-block-size: 2.75rem;                       
  font-size: var(--yz-kck); font-weight: 700; color: var(--mrk2);
  transition: color var(--mikro) var(--egri);
}
.sss-bag-one{ color: var(--toprak-mtn); }
.sss-bag-ik{ inline-size: .8rem; block-size: .8rem; flex: none; }
html[dir="rtl"] .sss-bag-ik{ transform: scaleX(-1); }
@media (hover: hover){ .sss-bag:hover{ color: var(--mrk); } }

@media (prefers-reduced-motion: reduce){
  .sss-dusun i{ animation: none; }
  .sss-art, .sss-gnd, .sss-ilet, .sss-bag, .sss-soru{ transition: none; }
}

                                                                   
                                                                     
                                                                         
.sss-oge{
  padding-inline: 0;
  transition: background-color var(--gecis) var(--egri), padding-inline var(--gecis) var(--egri);
}
.sss-oge[data-vurgu]{
  background: var(--z2);
  padding-inline: var(--bo-1);
  border-radius: var(--yr-s);
}
@media (prefers-reduced-motion: reduce){ .sss-oge{ transition: none; } }

                          
                                                                          
                                                                    
                                                                       
                                                                          
.sss-balon .sss-sec-kap{ display:flex; flex-wrap:wrap; gap:.4rem; margin-block-start:.7rem }
.sss-balon .sss-sec-dgm{
  font:inherit; font-size:var(--yz-kck); line-height:1.25; font-weight:600;
  padding:.45rem .8rem; border-radius:var(--yr-tam); cursor:pointer;
  color:var(--mrk); background:var(--z1); border:1px solid var(--cizgi-bilesen);
                                                                           
                                                     
                                                                        
                                                                       
                                                                   
                                                           
                                                                        
                                                         
                                                                     
                                                                     
                                         
                                                                  
                                                                          
                                                                     
  transition:background var(--gecis), box-shadow var(--gecis);
}
.sss-balon .sss-sec-dgm:hover:not(:disabled){
  background:var(--z2);
  box-shadow:0 1px 2px rgba(11,15,14,.06), 0 6px 16px -8px rgba(11,15,14,.22);
}
.sss-balon .sss-sec-dgm:disabled{ cursor:default; opacity:.45 }
.sss-balon .sss-sec-dgm[data-sec-secili]{
  opacity:1; color:var(--z1); background:var(--mrk); border-color:var(--mrk);
}
