/* Smart Forms Builder - additional polish on top of Tailwind */
html, body { background: #0b0b0f; }
:root { color-scheme: dark; }
body { font-feature-settings: "ss01","cv11"; }

/* Custom scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.16); }

/* Focus ring */
*:focus-visible {
  outline: 2px solid rgba(167,139,250,0.7);
  outline-offset: 2px;
  border-radius: 8px;
}

/* Nice underline animation for links */
.link-underline {
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .25s ease;
}
.link-underline:hover { background-size: 100% 1px; }

/* Loading dots */
.dot-loader span {
  display:inline-block; width:6px; height:6px; margin:0 2px; border-radius:50%;
  background: currentColor; opacity:.4; animation: db 1.2s infinite ease-in-out;
}
.dot-loader span:nth-child(2){ animation-delay:.2s; }
.dot-loader span:nth-child(3){ animation-delay:.4s; }
@keyframes db { 0%,80%,100%{ transform:scale(.6); opacity:.3;} 40%{ transform:scale(1.1); opacity:1;} }

/* Drag handle visibility */
.drag-handle { cursor: grab; }
.drag-handle:active { cursor: grabbing; }

/* RTL helpers */
input, textarea, select { direction: inherit; }

/* Print friendly */
@media print {
  .no-print { display: none !important; }
}

/* fade-in helper */
.fade-in { animation: fadein .35s ease both; }
@keyframes fadein { from{ opacity:0; transform: translateY(4px);} to{ opacity:1; transform:none;} }