/* =========================================================
   DUREX iframe form skin
   ========================================================= */

:root{
  --dx-white:#fff;
  --dx-black:#0b0b0f;
  --dx-pink:#ff2aa6;
  --dx-fuchsia:#d600ff;
  --dx-blue:#5aa8ff;
}

/* iframe: neka bude “blend” s parentom */
body{
  background-color: transparent;
  color: var(--dx-white);
  font-family: 'Barlow', system-ui, -apple-system, Arial, sans-serif;
  padding: 10px 6px;
}

/* mali “glass” frame unutar iframa */
.container{
  max-width: 920px;
}

form.ledo{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  padding: 18px 16px;
  box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

/* label i pomoćni tekst */
label{
  color: rgba(255,255,255,.92);
  font-weight: 600;
  letter-spacing: .2px;
}

small, .help-block{
  color: rgba(255,255,255,.78);
}

/* error poruke – ostaju crvene ali čitljive na dark */
.help-block.with-errors{
  color: #ff5a5a;
}

/* inputi */
.form-control{
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  color: var(--dx-white);
  border-radius: 12px;
  height: calc(1.5em + .95rem + 2px);
}

.form-control::placeholder{
  color: rgba(255,255,255,.60);
}

.form-control:focus{
  background: rgba(255,255,255,.12);
  border-color: rgba(255,42,166,.65);
  box-shadow: 0 0 0 .2rem rgba(255,42,166,.18);
  color: var(--dx-white);
}

/* validator: bootstrap v4 često dodaje .has-error na parent */
.has-error .form-control{
  border-color: rgba(255,90,90,.85);
}
.has-success .form-control{
  border-color: rgba(90,255,170,.55);
}

/* custom-file */
.custom-file-label{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: inline-block;

  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.85);
  border-radius: 12px;
}

.custom-file-label::after{
  content:"Dodaj";
  background: rgba(255,255,255,.14);
  color: #fff;
  border-left: 1px solid rgba(255,255,255,.16);
}

.custom-file-input:focus ~ .custom-file-label{
  border-color: rgba(255,42,166,.65);
  box-shadow: 0 0 0 .2rem rgba(255,42,166,.18);
}

/* input group append button */
.input-group-append .btn{
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: rgba(255,255,255,.88);
}
.input-group-append .btn:hover{
  background: rgba(255,255,255,.14);
  color: #fff;
}

/* Drag & drop */
@media (max-width: 767.98px){
  #drag-and-drop-area{ display:none; }
}
@media (min-width: 768px){
  #drag-and-drop-area{
    display:flex;
    align-items:center;
    justify-content:center;
    height: 100%;
    border: 2px dashed rgba(255,255,255,.28);
    border-radius: 14px;
    text-align:center;
    position: relative;
    color: rgba(255,255,255,.85);
    background: rgba(255,255,255,.06);
  }
}

#drag-and-drop-area.dragover{
  background: rgba(255,42,166,.14);
  border-color: rgba(255,42,166,.55);
}

#drag-and-drop-area.uploaded{
  border-color: rgba(90,255,170,.60);
  background: rgba(90,255,170,.08);
}

.upload-icon, #drag-and-drop-area .file-icon{
  color: rgba(255,255,255,.9);
  font-size: 22px;
}

/* Checkbox (pravila) */
.custom-control-label{
  color: rgba(255,255,255,.90);
}
.custom-control-input:checked ~ .custom-control-label::before{
  background-color: var(--dx-pink);
  border-color: var(--dx-pink);
}

/* Submit button – Durex gradient pill */
.btn-send{
  background: linear-gradient(90deg, var(--dx-pink), var(--dx-fuchsia)) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 9999px;
  padding: .85rem 1.35rem;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
  box-shadow: 0 16px 34px rgba(255,42,166,.20);
}

.btn-send:hover,
.btn-send:focus{
  transform: translateY(-1px);
  color:#fff !important;
  box-shadow: 0 20px 44px rgba(255,42,166,.28);
}

.btn-send[disabled]{
  opacity: .7;
  cursor: not-allowed;
  transform: none;
}

/* spinner */
.loading-spinner{
  display:none;
  margin-left: 10px;
}
.btn-loading .loading-spinner{
  display:inline-block;
}

/* Honeypot - skriveno vizualno, ali ne display:none */
.hp-wrap{
  position:absolute !important;
  left:-10000px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

/* =========================================================
   GATE PAGE (before / after campaign)
   ========================================================= */

.dx-gate{
  display:flex;
  align-items:center;
  justify-content:center;
  background: transparent;
  color:#fff;
  padding:18px;
}

.dx-gate-box{
  width:min(760px, 100%);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius:16px;
  padding:22px 18px;
  box-shadow:0 18px 44px rgba(0,0,0,.22);
  text-align:center;
}

.dx-gate-title{
  margin:0 0 10px 0;
  font-size:20px;
  text-transform:uppercase;
  letter-spacing:.7px;
}

.dx-gate-text{
  margin:0;
  opacity:.92;
  font-size:16px;
  line-height:1.45;
}

/* Gate page mora biti "auto height" (ne 100%) */
.dx-gate-html,
.dx-gate-html body{
  height: auto !important;
  min-height: 0 !important;
}