@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap');

a:hover {text-decoration: none !important;}
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
*:after, *:before { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

body{ position: relative; width:100%; overflow-x:hidden!important; font-family: 'Open Sans', sans-serif; background-image:url("../img/bg.jpg"); background-repeat: no-repeat; background-size: cover; background-position: left top; background-attachment: fixed; }

.header, .header-m{ position: relative; display: table; width: 100%; margin: 0;}
.header img, .header-m img{ width: 100%;}
.header-m{display: none;}
/*.footer{ position: absolute; display: table; width:inherit; bottom: 30px; margin:0 0 0 -15px;}
.footer img{ width: 100%;}*/
.logo{position: relative; display: table; float: right; max-width: 200px; width: 100%; margin: 0;}
.logo img{ width: 100%;}
/*.container{min-height: 100vh;}*/
.form-holder{max-width: 640px;}
h2{position: relative; display: table; width: 100%; padding: 2% 5%; text-align: center; font-size: 16px; line-height: 22px; font-weight: 500; color: #ffffff; text-decoration: none;}
.footer{ position: relative; display: table; max-width: 860px; width: 100%; margin: -30px auto 50px; font-size: 16px; color: #820051;}


.btn-irv {width: 100%; background: #840053; color: #fff !important; font-weight: bold; padding: 10px 0; transition: all 0.3s;}
.btn-irv:hover {background: #550434; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);}
input[type=checkbox], input[type=radio] {margin: 4px 10px 0 0;}

.form-control:focus { border-color: #fcae18 !important; }
.btn:focus {outline:none !important;}

.result-holder{position: relative; display: table; max-width: 560px; width: 100%;  margin: 20% auto 0; padding: 2% 4% 3%; background: rgba(37,7,88,.8); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);}
.result-holder div{width: 100%; text-align: center; margin: 10% 0;}
.result-holder div p{font-size: 22px; line-height: 42px; font-weight: 600; color:rgba(255,255,255,.8)}
.result-holder div span{font-size:33px; font-weight: 600; color:rgba(255,255,255,1)}



@media (max-width:1024px){
    body{ background-image:url("../img/bg-m.jpg"); background-repeat: no-repeat; background-size: cover; background-position: left top; background-attachment: fixed; }
}

@media (max-width:768px){
    .logo{max-width: 180px;}    
}

@media (max-width:767px){
	.header-m{display: block;}
	.header{display: none;}
    .result-holder{margin: 30% auto 0;}
    .result-holder div p{font-size: 16px; line-height: 22px; }
    .result-holder div span{font-size:26px; } 
}


@media (max-width:480px){
    .footer {width: 93%; margin: 0;}
    .logo{max-width: 130px;} 
    .btn, .btn:visited{font-size: 16px; line-height: 20px;}    
}

@media (orientation: landscape) {
    body {background-image:url("../img/bg.jpg");}
}

/* --- BRCA ANKET TEK SAYFA (SINGLE PAGE) ÖZEL STİLLERİ --- */

/* Bütün anket beyaz kutu içerisinde olacak */
.survey-container {
    position: relative; 
    display: table; 
    max-width: 860px; 
    width: 100%;  
    margin: 5% auto 50px; 
    padding: 4% 5% 5%; 
    background: rgba(255,255,255,0.2);
    -webkit-border-radius: 20px; 
    -moz-border-radius: 20px; 
    border-radius: 20px; 
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.step { display: block !important; margin-bottom: 40px; }

/* Sorular kutu içerisinde ve wizard arka plan renginde */
.question-box { 
    background: rgba(130,0,81,1); 
    color: #ffffff; 
    font-size: 18px; 
    font-weight: 600; 
    padding: 15px 20px; 
    border-radius: 10px; 
    margin-bottom: 15px; 
    line-height: 24px;
}

/* Cevaplar kutusuz, beyaz arkaplanda okunması için metin rengi koyu */
ul { list-style: none; padding: 0; margin-left: 5px; }
ul li { margin-bottom: 10px; }
label { color: #333333 !important; font-weight: 600; margin-bottom: 0; cursor: pointer; font-size: 16px; display: inline-block;}

/* Anket şıkları ve cevap formu çerçevesinin rengi (wizard arkaplan rengi) */
.txt { 
    width: 100%; 
    padding: 10px 15px; 
    border-radius: 5px; 
    border: 1px solid rgba(130,0,81,.8) !important; 
    background-color: transparent !important; 
    outline: none;
    color: #333333 !important;
    font-size: 16px;
}
textarea.txt {
    min-height: 100px; 
}

input[type=radio] {
    margin-right: 8px !important;
    transform: scale(1.2);
}

.btn-irv { 
    background: #840053; 
    color: #fff; 
    padding: 12px 40px; 
    font-size: 18px; 
    border: none; 
    border-radius: 8px; 
    font-weight: bold;
    display: inline-block;
    width: auto;
    min-width: 200px;
}
.btn-irv:hover { background: #550434; color: #fff; }

/* SweetAlert2 arka plan ve içerik kaymasını önleme */
body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) {
    overflow-y: scroll !important;
    padding-right: 0 !important;
}

:root {
  --brca-pink: #e654a6;
  --brca-purple: #9b8fe0;
  --brca-cyan: #16c8d4;
}

/* BUTTON */
#savePoll {
  position: relative;
  overflow: hidden;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 240px;
  height: 55px;
  padding: 0 30px;

  border-radius: 28px;
  border: 2px ;
  cursor: pointer;

  font-size: 22px;
  font-weight: 600;
  color: #fff;

  background: linear-gradient(90deg,
    var(--brca-pink),
    var(--brca-purple),
    var(--brca-cyan));

  transition: all 0.3s ease;
}

/* TEXT WRAPPER */
#savePoll .btn-text {
  transition: all 0.3s ease;
}

/* HOVER → OUTLINE */
#savePoll:hover {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg,
      var(--brca-pink),
      var(--brca-purple),
      var(--brca-cyan)) border-box;

  border: 2px solid transparent;
}

/* HOVER TEXT GRADIENT */
#savePoll:hover .btn-text {
  background: linear-gradient(90deg,
    var(--brca-pink),
    var(--brca-purple),
    var(--brca-cyan));

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

/* CLICK EFFECT */
#savePoll:active {
  transform: scale(0.96);
}

/* LOADING STATE */
#savePoll.loading {
  pointer-events: none;
  color: transparent;
}

#savePoll.loading .btn-text {
  opacity: 0;
}

/* SPINNER */
#savePoll.loading::after {
  content: "";
  width: 22px;
  height: 22px;
  border: 3px solid rgba(255,255,255,0.4);
  border-top: 3px solid #fff;
  border-radius: 50%;
  position: absolute;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* DISABLED */
#savePoll:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

#savePoll.success {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg,
      var(--brca-pink),
      var(--brca-purple),
      var(--brca-cyan)) border-box;

  border: 2px solid transparent;
  pointer-events: none;
}

#savePoll.success .btn-text {
  background: linear-gradient(90deg,
    var(--brca-pink),
    var(--brca-purple),
    var(--brca-cyan));

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}


