/**
 * Ordotype Global Styles
 *
 * Non-critical CSS used across the site.
 *
 * Usage in Webflow header:
 * <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/william-ordotype/ordotype-scripts@main/shared/global-styles.css">
 */

/* Form Styles */
form#wf-form-mutateDocument {
    width: 100% !important;
}

.wf-form-search-bar-form {
    position: relative;
    display: inline-block;
}

/* Button Styles */
.reset-button {
    border: none;
    background: none;
    font-size: 1.2rem;
    cursor: pointer;
    color: #555;
}

.reset-button-navbar {
    border: none;
    background: none;
    cursor: pointer;
}

/* View Styles */
.drawer_view,
.modal_view {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* Autocomplete Styles */
.autocomplete-active {
    background-color: rgb(240, 243, 255) !important;
    color: #ffffff;
}

/* Alpine.js cloak */
[x-cloak] {
    display: none;
}

/* Decode HTML flex container */
.decode-html {
    display: flex;
}

/* Note uploader (mobile): the invisible file input (.input-file, position:
 * absolute; inset:0) covers the drop zone and is the real picker trigger, so
 * taps on the grey zone open the picker. The mobile "Importer des fichiers"
 * .button (a dead href="#") is painted above the input by a runtime/IX2 style,
 * so taps on the button itself can't reliably fall through via CSS — that case
 * is handled in global-utils.js (initNoteUploaderButton), which forwards a tap
 * on the button to the input. Keep z-index here so the grey zone keeps working;
 * the button MUST stay clickable for the JS handler to receive the tap. */
.note_uploader .input-file { z-index: 1; }
/* iOS sticky-hover: the .is-gradient:hover gradient change makes Safari treat
 * the FIRST tap on the upload button as "apply hover" and only fire `click` on
 * the SECOND tap (the "have to tap twice" bug). On touch devices, make :hover
 * identical to the base gradient so there's no hover change to gate on — the
 * first tap fires click, and global-utils.js opens the picker single-tap. */
@media (hover: none) {
  .uploader_w a.button.is-gradient:hover {
    background-image: radial-gradient(circle at 0 0, #7cd0ff, #3454f6 60% 103%);
  }
}

/* Pin footer to viewport bottom on very tall displays (>3000px wide screens, etc.) */
html, body { min-height: 100vh; }
body > div:has(> .page-wrapper) {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.page-wrapper { flex: 1 0 auto; }