/* ===== Ultimate Member – Button System (Phorm) ===== */
:root{
  --phorm-green:#00ad66;
  --phorm-orange-600:#f2a35e;     /* active */
  --phorm-orange-700:#f7ceaa;     /* pressed */
  --phorm-text:#1d1d1d;
  --phorm-white:#fff;
  --phorm-ring: 0 0 0 3px rgba(0,173,102,.25);
}

/* Base: applies to all UM buttons (submit + links styled as buttons) */
.um .um-button,
.um input[type="submit"].um-button,
.um a.um-button {
  appearance: none;
  border: none;
  border-radius: 999px !important;
  padding: .72rem 1.25rem;
  font-family: "Outfit", Sans-serif !important;
  font-weight: 800 !important;
  line-height: 1.1;
  text-decoration: none;
  background: var(--phorm-green) !important;
  color: var(--phorm-white);
  cursor: pointer;
  display: center;
  align-items: center;
  gap: .5rem;
  transition: transform .02s ease-in, filter .15s ease, box-shadow .15s ease;
  box-shadow: 0 0 0 3px rgba(0,173,102,.25);
}

/* Hover / Active */
.um .um-button:hover,
.um input[type="submit"].um-button:hover,
.um a.um-button:hover {
  filter: brightness(.97);
  background: var(--phorm-orange-600) !important;
  color: var(--phorm-text);
}
.um .um-button:active,
.um input[type="submit"].um-button:active,
.um a.um-button:active {
  transform: translateY(1px);
  background: var(--phorm-orange-700);
}

/* Keyboard focus (accessibility) */
.um .um-button:focus,
.um input[type="submit"].um-button:focus,
.um a.um-button:focus {
  outline: none;
  box-shadow: var(--phorm-ring);
}

/* Disabled state */
.um .um-button[disabled],
.um input[type="submit"].um-button[disabled],
.um a.um-button.um-disabled {
  opacity: .55;
  cursor: not-allowed;
  filter: grayscale(.15);
}

/* ===== Variant: Outline (secondary) =====
   If UM adds .um-alt on secondary buttons, this will catch it.
   You can also add .is-outline to any anchor/button via template override. */
.um .um-button.um-alt,
.um a.um-button.um-alt,
.um .um-button.is-outline {
  background: transparent;
  color: var(--phorm-white);
  border: none;
}
.um .um-button.um-alt:hover,
.um a.um-button.um-alt:hover,
.um .um-button.is-outline:hover {
  background: var(--phorm-green);
  color: var(--phorm-text);
}

/* ===== Subtle (linky) button – optional utility ===== */
.um .um-button.is-ghost {
  background: transparent;
  color: var(--phorm-text);
  border: none;
}
.um .um-button.is-ghost:hover { color: var(--phorm-green); }

/* ===== Sizes (use by adding a class to the button wrapper or via template) ===== */
.um .um-button.is-sm { padding: .55rem .9rem; font-size: .9rem; }
.um .um-button.is-lg { padding: .9rem 1.4rem; font-size: 1.05rem; }

/* ===== Icons (Font Awesome glyphs or inline SVG) ===== */
.um .um-button .icon {
  display:inline-flex;
  width:1.1em; height:1.1em; /* for SVGs */
}

/* Example: add a lock icon before “Login” if the button text isn't editable.
   Works only if Font Awesome 6 is loaded site-wide. */
.um form[action*="login"] .um-button[type="submit"]::before {
  content:"\f502"; /* fa-user-lock */
  font-family:"Font Awesome 6 Free"; font-weight:900;
  font-size: 1em;
  margin-right:.45rem;
}

/* ===== Make small text links near the form consistent (optional) ===== */
.um .um-col-alt a {
  font-weight: 600;
}
.um .um-col-alt a:hover { color: var(--phorm-green); }

/* Scope: front-end UM only (exclude .um-admin just in case) */
:where(.um):not(.um-admin) .um-form.um-register .um-button[type="submit"]{
  /* Primary style for the Register submit */
  border: none;
  border-radius: 999px;
  padding: .78rem 1.35rem;
  font-weight: 700;
  line-height: 1.1;
  text-align: center !important;
  background:  var(--phorm-white);  /* Phorm Green */
  color: var(--phorm-white);
  display: center;
  align-items: center !important;
  gap: .5rem;
  cursor: pointer;
  transition: transform .02s ease-in, filter .15s ease, box-shadow .15s ease;
}

:where(.um):not(.um-admin) .um-form.um-register .um-button[type="submit"]:hover{
  filter: brightness(.97);
  color: var(--phorm-text);
}
:where(.um):not(.um-admin) .um-form.um-register .um-button[type="submit"]:active{
  transform: translateY(1px);
  background: #00995b;
}
:where(.um):not(.um-admin) .um-form.um-register .um-button[type="submit"]:focus{
  outline: none;
  box-shadow: 0 0 0 3px rgba(0,173,102,.25);
}

/* Optional: outline variant if you add a class in your template */
:where(.um):not(.um-admin) .um-form.um-register .um-button.is-outline{
  background: transparent;
  color: #1d1d1d;
  border: 2px solid #00ad66;
}
:where(.um):not(.um-admin) .um-form.um-register .um-button.is-outline:hover{
  background: #00ad66; color:#fff;
}

/* Optional icon (requires Font Awesome 6 loaded site-wide) */
:where(.um):not(.um-admin) .um-form.um-register .um-button[type="submit"]::before{
  content:"\f234"; /* fa-user-plus */
  font-family:"Font Awesome 6 Free"; font-weight:900;
  font-size: 1em;
}
/* Ultimate Member – Login page: center "Register" and set hover color */
:where(.um):not(.um-admin) .um-form.um-login .um-col-alt {
  text-align: center; /* centers the links row */
}

:where(.um):not(.um-admin) .um-form.um-login .um-col-alt a[href*="register"] {
  display: inline-block;        /* lets us center the single link cleanly */
  text-align: center;
  transition: color .15s ease;
}

a.um-link-alt {
    line-height: 18px;
    color: #888 !important;
    display: block !important;
    text-decoration: none !important;
    font-weight: 400;
    text-align: center;
    border-bottom: none !important;
    font-size: 16px !important;
}
/* Botão Login */
body.page-id-355 .um-login .um-button {
  background-color: #1d1d1d !important;
  color: #ffffff !important;
  border-radius: 6px !important;
}

body.page-id-355 .um-login .um-button:hover {
  background-color: #333333 !important;
  color: #ffffff !important;
}

/* Botão Registar */
body.page-id-355 .um-register .um-button {
  background-color: #00ad66 !important;
  color: #ffffff !important;
  border-radius: 6px !important;
}

body.page-id-355 .um-register .um-button:hover {
  background-color: #009055 !important;
  color: #ffffff !important;
}

/* Forçar remoção de contorno verde claro dos botões UM */
.um .um-button,
.um .um-button:focus,
.um .um-button:active,
.um .um-button:hover {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;   /* tira o glow verde */
}
.um .um-button {
  border-radius: 40px !important; /* ou o valor que preferires */
}
/* Remove button shadows & outlines in all states */
.um input[type="submit"],
.um .um-button,
.um .um-button.um-alt,
.um .um-form input[type="submit"] {
    box-shadow: none !important;
    outline: none !important;
}

/* Also handle focus/active states */
.um input[type="submit"]:focus,
.um input[type="submit"]:active,
.um .um-button:focus,
.um .um-button:active,
.um .um-button.um-alt:focus,
.um .um-button.um-alt:active {
    box-shadow: none !important;
    outline: none !important;
}