/*
  Direction C button system — one language, matching the homepage .mh-btn exactly.

  Homepage buttons the user approved:
    .mh-btn--alert  → RED filled   (primary)
    .mh-btn--ghost  → NEUTRAL      (paper bg, subtle ink border; teal only on hover)
  So site buttons use the same two styles. There are NO teal-filled buttons — teal
  is an accent/hover colour only, never a button fill. Green is success-only.

  Loaded last on non-front pages (after css/petsitter-color.css) so it wins.
  Header / footer / homepage use their own .sh-* / .mh-* classes and are untouched.
*/

/* Shared shape + display font (mirrors .mh-btn) */
.btn,
.button,
input[type="submit"],
.wpcf7-submit,
.cleanlogin-form input[type="submit"]{
    display:inline-flex; align-items:center; justify-content:center; gap:.5em; text-align:center;
    -webkit-appearance:none; appearance:none;
    font-family:"Darker Grotesque", system-ui, sans-serif !important;
    font-weight:900 !important; font-size:1.15rem; line-height:1; letter-spacing:.01em;
    padding:.7em 1.3em; border-radius:11px !important; border:2px solid transparent; cursor:pointer;
    transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease, border-color .16s ease;
}

/* PRIMARY → orange (report / contact / submit-a-form actions) */
.btn-primary,
.button.alt,
.wpcf7-submit,
.cleanlogin-form input[type="submit"]{
    background:linear-gradient(180deg,#e89145,#cc7a2b) !important;
    border-color:transparent !important;
    color:#fff !important;
    text-shadow:0 1px 1px rgba(90,40,0,.28);
    box-shadow:0 16px 30px -16px rgba(204,122,43,.7);
}
.btn-primary:hover, .btn-primary:focus,
.button.alt:hover,
.wpcf7-submit:hover,
.cleanlogin-form input[type="submit"]:hover{
    background:#c0711f !important; color:#fff !important; transform:translateY(-2px);
}

/* SECONDARY → green (was a near-invisible paper "ghost"; now clearly a button).
   White field + solid green border/label, fills green on hover. */
.btn-secondary{
    background:#fff !important;
    border-color:#7ab02f !important;
    color:#4d7a1a !important;
    box-shadow:0 10px 22px -16px rgba(95,143,34,.55) !important;
}
.btn-secondary:hover, .btn-secondary:focus{
    background:#eaf3d9 !important; border-color:#5f8f22 !important; color:#4d7a1a !important; transform:translateY(-2px);
}

/* Text/link buttons — orange, green on hover */
.btn-link{ color:#cc7a2b !important; }
.btn-link:hover, .btn-link:focus{ color:#5f8f22 !important; }