* {
    font-family: "Inter", sans-serif;
}

::-webkit-scrollbar {
    display: none;
}

/* Keep autofilled inputs on the dark surface instead of the browser's default
   white/pale fill. The inset box-shadow paints over the user-agent autofill
   background, and text-fill-color keeps the entered text readable. The long
   transition defers the autofill repaint indefinitely so it never flashes white. */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill {
    -webkit-text-fill-color: #fff;
    caret-color: #fff;
    -webkit-box-shadow: 0 0 0 1000px var(--color-secondary-800) inset;
    box-shadow: 0 0 0 1000px var(--color-secondary-800) inset;
    transition: background-color 5000s ease-in-out 0s;
}

.highlighted-section {
    outline: 2px solid #3F20FB;
    background-color: rgba(63, 32, 251, 0.1);
}

.edit-button {
    position: absolute;
    z-index: 1000;
}

/* Safe area utility for full-screen overlays on mobile */
.safe-area-padding {
    padding-top: calc(env(safe-area-inset-top, 0px) + 12px);
    padding-right: calc(env(safe-area-inset-right, 0px) + 12px);
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
    padding-left: calc(env(safe-area-inset-left, 0px) + 12px);
}

/* Brand mark fallback sizing. Tailwind h-X classes (h-4, h-6, h-12, etc.)
   sit on top of this rule and override the height when present.
   The 1em default keeps the mark scaled to the surrounding text size if
   the Tailwind class fails to apply (e.g. dynamically-rendered classes
   that the Play CDN scanner misses), so the natural 216x263 image never
   blows out the layout. */
.doclokr-brand-mark {
    display: inline-block;
    width: auto;
    height: 1em;
    flex-shrink: 0;
    object-fit: contain;
}