/*
 * Thayu.Market global readability layer.
 * Keeps Quicksand consistent across the public marketplace while improving
 * text contrast, form legibility, focus visibility and comfortable line height.
 */

:root {
  --thayu-readable-text: #101828;
  --thayu-readable-muted: #475467;
  --thayu-readable-link: #0b5b42;
  --thayu-readable-focus: #0a47a4;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
strong,
small,
label,
button,
input,
select,
textarea,
optgroup,
option,
table,
th,
td {
  font-family: "Quicksand", "Segoe UI", Arial, sans-serif !important;
}

body {
  color: var(--thayu-readable-text);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
  line-height: 1.2;
  text-wrap: balance;
}

p,
li,
dt,
dd,
figcaption {
  line-height: 1.65;
}

strong,
b {
  font-weight: 700;
}

small,
.help-text,
.description,
.form-hint {
  font-size: max(.8125rem, 13px);
  font-weight: 500;
  line-height: 1.5;
}

button,
input,
select,
textarea {
  color: var(--thayu-readable-text);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.4;
}

button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.thayu-button,
.post-button,
.compact-post-button {
  font-weight: 700;
  letter-spacing: .005em;
}

label,
legend,
th {
  color: var(--thayu-readable-text);
  font-weight: 700;
}

input::placeholder,
textarea::placeholder {
  color: #667085;
  opacity: 1;
}

.site-main a:not(.thayu-button):not(.post-button):not(.card-overlay-link),
.page-section a:not(.thayu-button):not(.post-button) {
  text-decoration-thickness: .08em;
  text-underline-offset: .16em;
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible,
a:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--thayu-readable-focus);
  outline-offset: 3px;
}

/* Keep secondary text readable without flattening intentional dark panels. */
.site-main .muted,
.site-main .meta,
.site-main .description,
.site-main small:not(.badge):not(.status-badge),
.seller-dashboard-main .card-date,
.seller-dashboard-main .card-location,
.seller-dashboard-main .dashboard-stat-card span {
  color: var(--thayu-readable-muted);
  opacity: 1;
}

/* Form controls should retain the same readable type even in browser-native widgets. */
.settings-form-grid input,
.settings-form-grid select,
.settings-form-grid textarea,
.submit-listing-form input,
.submit-listing-form select,
.submit-listing-form textarea {
  font-family: "Quicksand", "Segoe UI", Arial, sans-serif !important;
  font-size: 1rem;
  font-weight: 500;
}

@media (max-width: 720px) {
  body {
    font-size: 16px;
    line-height: 1.6;
  }

  button,
  input,
  select,
  textarea {
    font-size: 16px;
  }
}

@media (forced-colors: active) {
  body,
  input,
  select,
  textarea,
  button {
    color: CanvasText;
  }
}
