/* Shared public UI primitives, field consistency update v37. Loaded after each page stylesheet.
   Only controls and equivalent bordered surfaces are normalized here.
   Avatars, photographic masks, pills, icon buttons and flat rows retain their shape. */
:root {
  --ui-radius-search: 999px;
  --ui-radius-field: 999px;
  --ui-radius-textarea: 20px;
  --ui-radius-button: 999px;
  --ui-radius-card: 14px;
  --ui-radius-dropdown: 14px;
  --ui-control-min: 44px;
}

/* One shape for every single-line entry, including fields inserted in dialogs.
   Native checkboxes, switches, sliders and file pickers retain their controls. */
:root :is(input:not([type]),input[type=text],input[type=search],input[type=email],
  input[type=tel],input[type=url],input[type=password],input[type=number],
  input[type=date],input[type=time],input[type=datetime-local],input[type=month],
  input[type=week],select),
:root #community-draft-form :is(input,select) {
  border-radius: var(--ui-radius-field);
}
/* Compound searches already have a rounded outer envelope. */
:root .hero-search input:not([type=hidden]) {
  border-radius: 0;
}

/* Search shells: the same outer shape in every public section. */
.hero-search,
.content-search,
.advice-hub .advice-search,
.ujtc-search,
.ui-search-shell {
  border-radius: var(--ui-radius-search);
  border-color: var(--line);
  min-width: 0;
  max-width: 100%;
}

/* Inset, fully rounded submit on every search family. */
.hero-search .btn {
  border-radius: var(--ui-radius-button);
  min-height: var(--ui-control-min);
  color: #fff;
}
.content-search .btn,
.advice-hub .advice-search .btn,
.ujtc-search button {
  border-radius: var(--ui-radius-button);
  min-height: var(--ui-control-min);
  color: #fff;
}
.content-search input,
.advice-hub .advice-search input,
.ujtc-search input {
  border-radius: var(--ui-radius-search);
  min-width: 0;
  min-height: var(--ui-control-min);
}
.hero-search .search-query-field,
.hero-search .search-location-field {
  border-radius: var(--ui-radius-field);
}

/* Menus keep their existing anchoring, stacking order and available viewport height. */
.hero-search .search-options,
.hero-search .location-panel,
.advice-theme .advice-theme-search-panel {
  border-radius: var(--ui-radius-dropdown);
  border-color: var(--line);
}

/* Text inputs may match :focus-visible after a pointer click. The global
   modality keeps pointer selection clean and keyboard navigation identifiable. */
:root :is(input,select,textarea):focus,
:root[data-field-focus="pointer"] :is(input,select,textarea):focus {
  outline: none !important;
  box-shadow: none !important;
}
:root .hero-search :is(.search-query-field,.search-location-field,label):focus-within {
  outline: none !important;
  box-shadow: none !important;
}
:root :is(.content-search,.advice-search,.ujtc-search,.ui-search-shell):focus-within {
  outline: none !important;
  box-shadow: none !important;
  border-color: var(--line);
}
:root:not([data-field-focus="pointer"]) :is(input,select,textarea):focus-visible {
  outline: 2px solid var(--cyan) !important;
  outline-offset: -3px;
}
.content-search .btn:focus-visible,
.advice-hub .advice-search .btn:focus-visible,
.ujtc-page .ujtc-search button:focus-visible,
.ui-search-shell button[type=submit]:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -5px;
}

/* Standalone fields: authentication, contact, teams, filter panels and drafts. */
.field :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea),
.pro-contact-field :is(input,textarea),
.pro-team-picker-search input,
.filter-group input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.professional-filters .filter-group>input:not([type=hidden]),
.land-input-unit input,
.land-filter-group select,
.land-result-controls select,
.professional-sort select,
.result-toolbar select,
.department-choice select,
.filters select[name=departement],
.ujti-filter-toolbar select,
.house-entry-fields input,
.reader-shell .reader-professionals>select,
.ujtc-reply-compose textarea,
.ujtc-compose-dialog :is(input,textarea,select),
#community-draft-form :is(input,textarea,select) {
  border-radius: var(--ui-radius-field);
  border-color: var(--line);
  min-height: var(--ui-control-min);
  min-width: 0;
  max-width: 100%;
}
/* Keep writing space rectangular inside long messages; a capsule would cut
   into the first and last lines. The same rule covers the copy fallback. */
:root textarea,
:root .field textarea,
:root .pro-contact-field textarea,
:root .ujtc-reply-compose textarea,
:root .ujtc-compose-dialog textarea,
:root #community-draft-form textarea,
:root select[multiple] {
  border-radius: var(--ui-radius-textarea);
  padding: 14px 18px;
}

/* Text sits clear of the curved ends. Preserve right-hand space already
   reserved for search icons, clearing actions and terrain units. */
.field input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.pro-contact-field input,
.pro-team-picker-search input,
.professional-filters .filter-group>input:not([type=hidden]),
.land-input-unit input,
.house-entry-fields input,
.ujtc-compose-dialog input,
#community-draft-form input,
dialog>input[readonly] {
  padding-left: 18px;
}
:root :is(.field,.land-filter-group,.land-result-controls,.professional-sort,
  .result-toolbar,.department-choice,.ujti-filter-toolbar,.reader-professionals,
  .ujtc-compose-dialog) select,
:root .filters select[name=departement],
:root #community-draft-form select {
  padding-left: 18px;
  padding-right: 34px;
}
.cw-page input { padding-left: 14px; }
.cw-page select { padding-left: 14px; padding-right: 30px; }
.cw-page :is(.cw-room-name,.cw-price-row) input {
  padding-left: 10px;
  padding-right: 10px;
}
/* Compact numeric columns need their full reading width. */
.cw-page .cw-mini-field input {
  padding-left: 6px;
  padding-right: 6px;
}

/* Standard text actions share the same capsule shape. */
.btn,
.btn.small,
.hero-search .btn,
.pro-feature-copy .btn,
.professional-team-band .pro-team-intro .btn,
.pro-team .btn,
.pro-contact-content .btn,
.pro-team-customize>.btn,
.reader-shell .reader-pro-band .btn,
.ujtc-page .btn,
.ujtc-compose-dialog .btn,
.ujtc-lightbox-controls>.btn,
.land-listing-row .land-card-action,
.land-hub .land-section-more .land-outline-link,
.professional-app-prompt .professional-app-qr,
.business-phone-toggle {
  border-radius: var(--ui-radius-button);
  min-height: var(--ui-control-min);
}
/* Keep the same capsule on submit buttons in the simple searches. */
.content-search .btn,
.advice-hub .advice-search .btn {
  border-radius: var(--ui-radius-button);
}

/* Equivalent framed cards. Image edges inside a framed card retain their existing
   flush corners; this does not round every article, section or professional row. */
.discovery-card,
.result-grid .directory-card,
.utility-card,
.start-choice,
.pro-preview,
.business-photo-grid>.business-card,
.business-related-grid>.business-card,
.business-contact-box,
.business-review-overview,
.business-review-empty,
.professional-app-prompt,
.professional-reading-link,
.pro-guide-grid .article-card,
.advice-hub .advice-feature-card,
.advice-hub .advice-sections-panel,
.advice-theme .advice-theme-feature,
.advice-theme .advice-theme-promo,
.land-category,
.land-filters,
.land-seller-box,
.ujtc-member-card,
.ujtc-side-section nav,
.ujtc-side-guide,
.ujtc-side-welcome,
.ujtc-reading,
.ujtc-reply-compose,
.ujtc-profile-project,
.ujtc-profile-albums>a,
.ujtc-group-directory>a {
  border-radius: var(--ui-radius-card);
}

@media (max-width: 700px) {
  /* Native input zoom on mobile must not change the scale of the page. */
  .hero-search input,
  .home-hero-reference .hero-search input,
  .content-search input,
  .advice-hub .advice-search input,
  .advice-theme .advice-theme-search-panel .advice-search input,
  .ujtc-search input,
  .ui-search-shell :is(input,select),
  .field :is(input:not([type=checkbox]):not([type=radio]),select,textarea),
  .pro-contact-field :is(input,textarea),
  .pro-team-picker-search input,
  .filter-group input:not([type=checkbox]):not([type=radio]),
  .professional-filters .filter-group>input:not([type=hidden]),
  .land-input-unit input,
  .land-filter-group select,
  .land-result-controls select,
  .professional-sort select,
  .result-toolbar select,
  .department-choice select,
  .reader-shell .reader-professionals>select,
  .ujtc-compose-dialog :is(input,textarea,select),
  .ujtc-reply-compose textarea {
    font-size: 16px;
  }
  .directory-card,
  .business-list>.business-card {
    border-radius: var(--ui-radius-card);
  }
  .land-result-controls {
    flex-wrap: wrap;
    min-width: 0;
  }
  .professional-result-toolbar {
    grid-template-columns: minmax(0,1fr) auto;
  }
  .professional-result-toolbar .professional-sort {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: stretch;
    min-width: 0;
  }
  .professional-sort select {
    width: 100%;
    max-width: 100%;
  }
}

@media (forced-colors: active) {
  :root:not([data-field-focus="pointer"]) :is(input,select,textarea):focus-visible {
    outline: 2px solid Highlight !important;
    outline-offset: -3px;
  }
}

/* Reference supplied on 13 October: white capsule, inset cyan action,
   white label and arrow. Keep one palette through normal/hover/focus/visited. */
:root .btn:not(.outline):not(.ujtc-lightbox-controls .btn):not(.mobile-band .btn),
:root .land-page .land-button,
:root .land-listing-row .land-card-action,
:root .business-contact-primary > .business-contact-main,
:root .business-contact-demo-button,
:root .pro-map-loading button,
:root .pro-map-popup-links button,
:root .cw-button:not(.cw-button-secondary):not(.cw-button-light),
:root .ujtc-search button[type=submit] {
  background: var(--cyan);
  color: #fff;
  border-color: var(--cyan);
  border-radius: var(--ui-radius-button);
  min-height: var(--ui-control-min);
}
:root .btn:not(.outline):not(.ujtc-lightbox-controls .btn):not(.mobile-band .btn) > :is(span,svg),
:root .ujtc-search button[type=submit] > svg {
  color: inherit;
}
:root .btn.outline,
:root .cw-button-secondary,
:root .cw-button-light {
  background: #fff;
  color: var(--navy);
  border-radius: var(--ui-radius-button);
}

/* A single-line search always has an inset action, including the compact forum
   icon button. No joined square left edge remains on the submit button. */
:root .content-search,
:root .advice-hub .advice-search,
:root .ujtc-search {
  padding: 5px;
  gap: 5px;
  height: auto;
  min-height: 56px;
  align-items: stretch;
  background: #fff;
  border-radius: var(--ui-radius-search);
}
:root .content-search input,
:root .advice-hub .advice-search input,
:root .ujtc-search input {
  background: transparent;
  border-radius: var(--ui-radius-search);
  min-width: 0;
  min-height: var(--ui-control-min);
}
:root .content-search .btn,
:root .advice-hub .advice-search .btn,
:root .ujtc-search button[type=submit] {
  border-radius: var(--ui-radius-button);
  margin: 0;
  min-height: var(--ui-control-min);
}
:root .ujtc-search button[type=submit] {
  width: 44px;
  flex: 0 0 44px;
}
:root .advice-hub .advice-search-icon {
  top: 50%;
  left: 19px;
  transform: translateY(-50%);
}
:root .hero-search .search-query-field,
:root .hero-search .search-location-field {
  --ui-radius-field: 999px;
  border-radius: var(--ui-radius-field);
}
:root .hero-search .search-query-field > label {
  border-radius: var(--ui-radius-field);
}
:root .pro-team-picker-search input,
:root .professional-filters .filter-group > input[name=q] {
  border-radius: var(--ui-radius-search);
}

@media (max-width:1100px) {
  /* Multi-row searches need a bounded envelope to avoid a tall oval cutting
     into their fields. Each submit remains a capsule at every width. */
  .hero-search {
    --ui-radius-search: 28px;
  }
}