/* Physkai branding: Axigen WebMail login page (Axigen 10.7) */
:root {
  --pk-primary: #7036e2;
  --pk-primary-hover: #5822c3;
  --pk-gradient: linear-gradient(135deg, #8b5cf6 0%, #3b9ef0 55%, #3dd9c9 100%);
  --pk-fg: #0f1729;
  --pk-muted: #6b7280;
  --pk-border: #e5e7eb;
  --pk-bg: #f9fafb;
  --pk-card: #ffffff;
  --pk-radius: 12px;
  --pk-font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

html body,
html body[class*="theme-"] {
  background: var(--pk-bg) !important;
  background-image:
    radial-gradient(60rem 40rem at 0% 0%, rgba(139, 92, 246, .14), transparent 60%),
    radial-gradient(50rem 36rem at 100% 100%, rgba(61, 217, 201, .14), transparent 60%) !important;
  background-attachment: fixed !important;
  color: var(--pk-fg) !important;
}
body *:not(svg):not(path) { font-family: var(--pk-font) !important; }

/* Hide the theme's photo/background layers */
html body::before,
html body::after,
body .app-container::before,
body .app-container::after { display: none !important; }
body .app-container { background: transparent !important; }

/* Card */
body .main-container {
  background: var(--pk-card) !important;
  border: 1px solid var(--pk-border) !important;
  border-radius: calc(var(--pk-radius) * 1.5) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 41, .04), 0 24px 48px -12px rgba(112, 54, 226, .18) !important;
  padding: 40px 0 28px !important;
  margin-top: 32px !important;
  max-width: calc(100vw - 32px);
  backdrop-filter: none !important;
}

/* Logo */
body .main-container .logo {
  background: url("logo-192.png") center / contain no-repeat !important;
  height: 72px !important;
  margin-bottom: 12px !important;
}
body .main-container .logo * { display: none !important; }

body .main-container h1 {
  color: var(--pk-fg) !important;
  font-weight: 700 !important;
  letter-spacing: -.02em;
}
body .main-container h2 { color: var(--pk-muted) !important; font-weight: 400 !important; }

/* Fields */
body .main-container form input {
  color: var(--pk-fg) !important;
  background: #fff !important;
  border: 1px solid var(--pk-border) !important;
  border-radius: var(--pk-radius) !important;
  box-shadow: none !important;
  transition: border-color .15s, box-shadow .15s;
}
body .main-container form input:focus {
  border-color: var(--pk-primary) !important;
  box-shadow: 0 0 0 3px rgba(112, 54, 226, .18) !important;
  outline: none !important;
}
body .main-container form label {
  background: var(--pk-card) !important;
  color: var(--pk-muted) !important;
}
body .main-container form input:focus + label,
body .main-container form input:focus ~ label { color: var(--pk-primary) !important; }
body .main-container form svg,
body .main-container form [class*="toggle"] { color: var(--pk-muted) !important; fill: currentColor; }
body .main-container input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color: var(--pk-fg) !important;
}

/* Primary button */
body .main-container button.main-cta {
  background: var(--pk-primary) !important;
  background-image: var(--pk-gradient) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--pk-radius) !important;
  font-weight: 600 !important;
  box-shadow: 0 8px 20px -6px rgba(112, 54, 226, .45) !important;
  transition: filter .15s, transform .15s;
}
body .main-container button.main-cta:hover { filter: brightness(1.06); transform: translateY(-1px); }
body .main-container button.main-cta:disabled { filter: grayscale(.4) opacity(.7); transform: none; }

/* Links, checkboxes, secondary text */
body .main-container a,
body .footer-container a { color: var(--pk-primary) !important; }
body .main-container a:hover,
body .footer-container a:hover { color: var(--pk-primary-hover) !important; }
body .main-container input[type="checkbox"] { accent-color: var(--pk-primary); }

/* Language picker */
body .react-select__control {
  background: #fff !important;
  border: 1px solid var(--pk-border) !important;
  border-radius: 8px !important;
}
body .react-select__single-value,
body .react-select__input-container,
body .language-container span { color: var(--pk-fg) !important; }
body .react-select__indicator { color: var(--pk-muted) !important; }
body .react-select__menu { border-radius: 8px !important; overflow: hidden; }
body .react-select__option--is-focused { background: rgba(112, 54, 226, .08) !important; }
body .react-select__option--is-selected { background: var(--pk-primary) !important; color: #fff !important; }

/* Messages and footer */
body .message-container * { border-radius: var(--pk-radius) !important; }
body .footer-container,
body .footer-container * { color: var(--pk-muted) !important; }

/* Loading spinner */
body .loading-mask { background: var(--pk-bg) !important; }
body .loading-spinner .path { stroke: var(--pk-primary) !important; }

/* Phones */
@media (max-width: 540px) {
  body .main-container { width: auto !important; margin: 16px !important; }
  body .main-container form { padding: 0 20px !important; box-sizing: border-box; width: 100% !important; }
  body .main-container form .row,
  body .main-container form .col,
  body .main-container form input { width: 100% !important; max-width: 100% !important; box-sizing: border-box; }
}