/* Docshar — shared base styles (page, scrollbars, spinners, form inputs, toasts, drop zones). */
html, body { height: 100%; }
body { -webkit-font-smoothing: antialiased; }
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { scrollbar-width: none; }

/* Spinners */
.spinner { width: 16px; height: 16px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 9999px; animation: df-spin .7s linear infinite; display: inline-block; }
.spinner-lg { width: 28px; height: 28px; border-width: 3px; }
@keyframes df-spin { to { transform: rotate(360deg); } }

/* Form inputs */
input[type="range"] { accent-color: #6366f1; width: 100%; }
input[type="color"] { -webkit-appearance: none; appearance: none; width: 36px; height: 36px; border: 1px solid #e2e8f0; border-radius: 9px; padding: 3px; background: #fff; cursor: pointer; }
input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
input[type="color"]::-webkit-color-swatch { border: none; border-radius: 6px; }
input[type="color"]::-moz-color-swatch { border: none; border-radius: 6px; }
input[type="color"]:disabled { opacity: .4; cursor: not-allowed; }
kbd { font-family: inherit; font-size: 10.5px; font-weight: 600; padding: 1px 6px; border-radius: 5px; background: #f1f5f9; border: 1px solid #e2e8f0; border-bottom-width: 2px; color: #475569; }

/* Toasts */
.toast { animation: toast-in .22s ease-out; }
.toast.leaving { animation: toast-out .2s ease-in forwards; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes toast-out { to { opacity: 0; transform: translateY(6px) scale(.98); } }

/* Drop zone */
.dropzone[data-hover="true"] { border-color: #6366f1; background: #eef2ff; }

/* Icon placeholders keep their size (w-4 h-4 …) until lucide (deferred) swaps them for SVGs, so nothing shifts. */
i[data-lucide] { display: inline-block; }

/* Loading / failed states of on-demand parts (#tvEngine, #edLoading): only the [data-when] child for the current state shows. */
.lazy-state[data-state="loading"] [data-when="failed"], .lazy-state[data-state="failed"] [data-when="loading"] { display: none; }

/* Google AdSense Responsive Ad Units */
.df-ad-container {
  display: block;
  margin: 28px auto;
  text-align: center;
  position: relative;
  max-width: 100%;
  clear: both;
}
.df-ad-label {
  display: block;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
  margin-bottom: 6px;
  user-select: none;
}
.df-ad-container.df-ad-disabled,
.df-ad-container[data-ad-status="disabled"],
.df-ad-container[data-ad-status="unconfigured"] {
  display: none !important;
}