/* ============================================================
   Roam Wild Africa — premium login + desk theme
   Warm sand · gold · ink  |  matches roamwildafrica.com
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,550;9..144,650;9..144,700&family=Outfit:wght@300;400;500;600&display=swap");

:root {
  /* --- Brand tokens (canonical — keep in sync with roamwildafrica.com) --- */
  --rw-ink: #140a02;
  --rw-ink-soft: #3d2a18;
  --rw-earth: #5c3d1f;
  --rw-dust: #9a6b3c;
  --rw-gold: #c4893a;
  --rw-gold-deep: #a86c2e;
  --rw-gold-bright: #b8792e;
  --rw-sand: #f4e8d0;
  --rw-sand-mid: #e8d5b5;
  --rw-sand-deep: #d9c19a;
  --rw-line: rgba(107, 68, 32, 0.18);

  /* Highlight end of gold gradients. The brand `gold-bright` is deeper than
     `gold`, so gradients need a lighter stop to read light -> dark. */
  --rw-gold-glow: #dbab55;

  --rw-cream: #fbf4e6;
  --rw-cream-soft: #fffaf0;
  --rw-shadow: 0 28px 64px rgba(61, 42, 24, 0.18);
  --rw-font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --rw-font-body: "Outfit", system-ui, sans-serif;
  --primary: #c4893a;
  --primary-color: #c4893a;
}

/* ============================================================
   DESK (post-login)
   Drives Frappe's own design tokens so the whole app inherits the
   sand palette, instead of chasing individual components.
   Scoped away from [data-path="login"], which has its own takeover below.
   ============================================================ */

body:not([data-path="login"]) {
  /* surfaces */
  --bg-color: #faf3e6;
  --fg-color: var(--rw-cream-soft);
  --card-bg: var(--rw-cream-soft);
  --subtle-fg: #f3e9d6;
  --subtle-accent: rgba(196, 137, 58, 0.08);
  --control-bg: #fffdf8;
  --control-bg-on-gray: #f3e9d6;
  --disabled-control-bg: #efe4cd;
  --fg-hover-color: rgba(196, 137, 58, 0.1);

  /* type */
  --text-color: var(--rw-ink);
  --text-muted: rgba(20, 10, 2, 0.55);
  --text-light: rgba(20, 10, 2, 0.42);
  --heading-color: var(--rw-ink);
  --font-family: var(--rw-font-body);

  /* lines + accents */
  --border-color: var(--rw-line);
  --dark-border-color: rgba(107, 68, 32, 0.28);
  --primary: var(--rw-gold);
  --primary-color: var(--rw-gold);

  /* navbar + sidebar */
  --navbar-bg: var(--rw-sand-mid);
  --sidebar-select-color: rgba(196, 137, 58, 0.16);

  background-color: var(--bg-color) !important;
  font-family: var(--rw-font-body);
  color: var(--rw-ink);
}

/* --- Navbar: warm sand, never near-black --- */
body:not([data-path="login"]) .navbar {
  background: linear-gradient(180deg, var(--rw-sand) 0%, var(--rw-sand-mid) 100%) !important;
  border-bottom: 1px solid var(--rw-line) !important;
  box-shadow: 0 1px 0 rgba(196, 137, 58, 0.18) !important;
}

body:not([data-path="login"]) .navbar .navbar-brand img,
body:not([data-path="login"]) .navbar .app-logo {
  max-height: 30px !important;
  border-radius: 50%;
  box-shadow: 0 0 0 2px rgba(255, 253, 248, 0.9);
}

body:not([data-path="login"]) .navbar .navbar-nav > li > a,
body:not([data-path="login"]) .navbar .nav-link,
body:not([data-path="login"]) .navbar .dropdown-toggle {
  color: var(--rw-ink-soft) !important;
  font-weight: 500;
}

body:not([data-path="login"]) .navbar .navbar-nav > li > a:hover,
body:not([data-path="login"]) .navbar .nav-link:hover {
  color: var(--rw-gold-bright) !important;
}

/* Navbar search / awesomebar */
body:not([data-path="login"]) #navbar-search,
body:not([data-path="login"]) .navbar .search-bar .awesomplete input {
  background: rgba(255, 253, 248, 0.85) !important;
  border: 1px solid var(--rw-line) !important;
  border-radius: 999px !important;
  color: var(--rw-ink) !important;
}

body:not([data-path="login"]) #navbar-search:focus,
body:not([data-path="login"]) .navbar .search-bar .awesomplete input:focus {
  border-color: var(--rw-gold) !important;
  box-shadow: 0 0 0 3px rgba(196, 137, 58, 0.18) !important;
  outline: none !important;
}

/* --- Desk sidebar --- */
body:not([data-path="login"]) .desk-sidebar,
body:not([data-path="login"]) .layout-side-section .sidebar-menu,
body:not([data-path="login"]) .body-sidebar {
  background: linear-gradient(180deg, #f7eeda 0%, #f2e6cd 100%) !important;
  border-right: 1px solid var(--rw-line) !important;
}

body:not([data-path="login"]) .desk-sidebar .standard-sidebar-item {
  border-radius: 10px !important;
  color: var(--rw-ink-soft) !important;
  font-weight: 500;
}

body:not([data-path="login"]) .desk-sidebar .standard-sidebar-item:hover {
  background: rgba(196, 137, 58, 0.12) !important;
}

body:not([data-path="login"]) .desk-sidebar .standard-sidebar-item.selected {
  background: rgba(196, 137, 58, 0.2) !important;
  box-shadow: inset 3px 0 0 var(--rw-gold-bright);
}

body:not([data-path="login"]) .desk-sidebar .standard-sidebar-item.selected .sidebar-item-label,
body:not([data-path="login"]) .desk-sidebar .standard-sidebar-item.selected .sidebar-item-icon,
body:not([data-path="login"]) .desk-sidebar .standard-sidebar-item.selected a {
  color: var(--rw-gold-bright) !important;
  font-weight: 600 !important;
}

body:not([data-path="login"]) .sidebar-label,
body:not([data-path="login"]) .standard-sidebar-label {
  color: rgba(20, 10, 2, 0.5) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.72rem;
}

/* --- Page shell + cards --- */
body:not([data-path="login"]) .page-head,
body:not([data-path="login"]) .page-head-content {
  background: transparent !important;
  border-bottom: 1px solid var(--rw-line) !important;
}

body:not([data-path="login"]) .page-title .title-text,
body:not([data-path="login"]) .page-head .title-text,
body:not([data-path="login"]) h1,
body:not([data-path="login"]) h2,
body:not([data-path="login"]) h3 {
  font-family: var(--rw-font-display) !important;
  font-weight: 650 !important;
  letter-spacing: -0.015em;
  color: var(--rw-ink) !important;
}

body:not([data-path="login"]) .layout-main-section,
body:not([data-path="login"]) .form-page,
body:not([data-path="login"]) .widget,
body:not([data-path="login"]) .number-widget-box,
body:not([data-path="login"]) .shortcut-widget-box,
body:not([data-path="login"]) .links-widget-box,
body:not([data-path="login"]) .chart-widget {
  background: var(--rw-cream-soft) !important;
  border: 1px solid var(--rw-line) !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 2px rgba(107, 68, 32, 0.05) !important;
}

/* Workspace widgets lift on hover */
body:not([data-path="login"]) .widget:hover,
body:not([data-path="login"]) .shortcut-widget-box:hover,
body:not([data-path="login"]) .number-widget-box:hover {
  border-color: rgba(196, 137, 58, 0.42) !important;
  box-shadow: 0 6px 18px rgba(107, 68, 32, 0.1) !important;
}

body:not([data-path="login"]) .widget .widget-head .widget-title,
body:not([data-path="login"]) .number-widget-box .widget-title {
  font-family: var(--rw-font-display) !important;
  font-weight: 600 !important;
  color: var(--rw-ink) !important;
}

body:not([data-path="login"]) .number-widget-box .widget-content .number {
  font-family: var(--rw-font-display) !important;
  font-weight: 700 !important;
  color: var(--rw-gold-bright) !important;
}

/* --- Section headings on forms: travel-ops voice --- */
body:not([data-path="login"]) .form-section .section-head,
body:not([data-path="login"]) .section-head {
  font-family: var(--rw-font-display) !important;
  font-weight: 600 !important;
  font-size: 0.86rem !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--rw-earth) !important;
  border-bottom: 1px solid var(--rw-line);
  padding-bottom: 0.35rem;
}

/* --- List views --- */
body:not([data-path="login"]) .list-row-head,
body:not([data-path="login"]) .list-row-head.text-muted {
  background: linear-gradient(180deg, var(--rw-sand) 0%, var(--rw-sand-mid) 100%) !important;
  border-bottom: 1px solid var(--rw-line) !important;
  color: var(--rw-earth) !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.74rem;
}

body:not([data-path="login"]) .list-row-container {
  border-bottom: 1px solid var(--rw-line) !important;
}

body:not([data-path="login"]) .list-row:hover,
body:not([data-path="login"]) .list-row-container:hover {
  background: rgba(196, 137, 58, 0.07) !important;
}

body:not([data-path="login"]) .list-subject a,
body:not([data-path="login"]) .list-row a.ellipsis {
  color: var(--rw-ink) !important;
  font-weight: 500;
}

body:not([data-path="login"]) .list-row a.ellipsis:hover {
  color: var(--rw-gold-bright) !important;
}

/* Status pills — keep semantics, warm the neutrals; never purple */
body:not([data-path="login"]) .indicator-pill.gray,
body:not([data-path="login"]) .indicator-pill.grey {
  background: var(--rw-sand-deep) !important;
  color: var(--rw-earth) !important;
}

body:not([data-path="login"]) .indicator-pill.orange,
body:not([data-path="login"]) .indicator-pill.yellow {
  background: rgba(196, 137, 58, 0.22) !important;
  color: #8a5720 !important;
}

body:not([data-path="login"]) .indicator-pill.purple,
body:not([data-path="login"]) .indicator-pill.pink {
  background: rgba(196, 137, 58, 0.22) !important;
  color: #8a5720 !important;
}

/* --- Kanban --- */
body:not([data-path="login"]) .kanban .kanban-column .kanban-column-title,
body:not([data-path="login"]) .kanban-column-header {
  font-family: var(--rw-font-display) !important;
  font-weight: 600 !important;
  color: var(--rw-earth) !important;
}

body:not([data-path="login"]) .kanban .kanban-card {
  background: var(--rw-cream-soft) !important;
  border: 1px solid var(--rw-line) !important;
  border-radius: 12px !important;
}

/* --- Buttons --- */
body:not([data-path="login"]) .btn-primary,
body:not([data-path="login"]) .btn-primary:not(:disabled):not(.disabled),
body:not([data-path="login"]) button.btn-primary {
  background: linear-gradient(135deg, var(--rw-gold), var(--rw-gold-deep)) !important;
  border-color: transparent !important;
  color: #fffaf0 !important;
  font-weight: 600 !important;
  border-radius: 999px !important;
  box-shadow: 0 2px 8px rgba(168, 108, 46, 0.28) !important;
}

body:not([data-path="login"]) .btn-primary:hover,
body:not([data-path="login"]) .btn-primary:focus {
  background: linear-gradient(135deg, var(--rw-gold-glow), var(--rw-gold)) !important;
  color: var(--rw-ink) !important;
  box-shadow: 0 4px 14px rgba(168, 108, 46, 0.36) !important;
}

body:not([data-path="login"]) .btn-default,
body:not([data-path="login"]) .btn-secondary {
  background: rgba(255, 253, 248, 0.9) !important;
  border: 1px solid var(--rw-line) !important;
  color: var(--rw-ink-soft) !important;
  border-radius: 999px !important;
}

body:not([data-path="login"]) .btn-default:hover,
body:not([data-path="login"]) .btn-secondary:hover {
  border-color: var(--rw-gold) !important;
  background: #fffaf0 !important;
}

/* --- Form controls --- */
body:not([data-path="login"]) .form-control,
body:not([data-path="login"]) .input-with-feedback {
  background: #fffdf8 !important;
  border: 1px solid var(--rw-line) !important;
  border-radius: 8px !important;
  color: var(--rw-ink) !important;
}

body:not([data-path="login"]) .form-control:focus {
  border-color: var(--rw-gold) !important;
  box-shadow: 0 0 0 3px rgba(196, 137, 58, 0.18) !important;
}

/* --- Links + misc accents (purge default indigo/purple) --- */
body:not([data-path="login"]) a,
body:not([data-path="login"]) .text-primary {
  color: var(--rw-gold-bright);
}

body:not([data-path="login"]) a:hover {
  color: var(--rw-gold-deep);
}

body:not([data-path="login"]) .sidebar-item-icon svg,
body:not([data-path="login"]) .widget-head .widget-title svg {
  stroke: var(--rw-earth);
}

/* ============================================================
   LOGIN — full takeover (hide broken website chrome)
   ============================================================ */

body[data-path="login"] {
  font-family: var(--rw-font-body) !important;
  color: var(--rw-ink) !important;
  background-color: var(--rw-sand) !important;
  background-image:
    radial-gradient(ellipse 90% 60% at 85% -10%, rgba(219, 171, 85, 0.45), transparent 55%),
    radial-gradient(ellipse 70% 50% at -5% 100%, rgba(154, 107, 60, 0.22), transparent 50%),
    linear-gradient(165deg, #f6ecd8 0%, var(--rw-sand) 42%, var(--rw-sand-deep) 100%) !important;
  background-attachment: fixed !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  -webkit-font-smoothing: antialiased;
}

/* Kill broken website navbar / footer on auth screens */
body[data-path="login"] .navbar,
body[data-path="login"] .web-footer,
body[data-path="login"] footer,
.for-login .navbar,
.for-forgot .navbar,
.for-signup .navbar,
.for-login .web-footer,
.for-forgot .web-footer,
.for-signup .web-footer,
body[data-path="login"] .navbar-toggler,
body[data-path="login"] .navbar-collapse {
  display: none !important;
}

body[data-path="login"] .main-section,
body[data-path="login"] .container.page-body,
body[data-path="login"] .page-content-wrapper,
.for-login .page-container,
.for-login .main-section {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/*
  Frappe puts ALL auth panels in the DOM (login / signup / forgot / email-link).
  Only one should be visible — never stack 4×100vh (that caused the scroll).
*/
body[data-path="login"] section.for-login,
body[data-path="login"] section.for-forgot,
body[data-path="login"] section.for-signup,
body[data-path="login"] section.for-login-with-email-link {
  display: none !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  padding: 1.5rem 1.25rem !important;
  margin: 0 !important;
  gap: 0 !important;
  box-sizing: border-box !important;
  overflow: auto !important;
}

/* Login visible by default; .hide wins after rw-auth.js / Frappe hash sync */
body[data-path="login"] section.for-login {
  display: flex !important;
}

body[data-path="login"] section.for-login.hide {
  display: none !important;
}

/* Secondary panels: only after rw-auth.js marks body ready AND removes .hide */
body[data-path="login"].rw-auth-ready section.for-forgot:not(.hide),
body[data-path="login"].rw-auth-ready section.for-signup:not(.hide),
body[data-path="login"].rw-auth-ready section.for-login-with-email-link:not(.hide) {
  display: flex !important;
}

/* Brand block ABOVE the card */
body[data-path="login"] section > .page-card-head {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 0 1rem !important;
  text-align: center !important;
  width: min(100%, 400px) !important;
  flex-shrink: 0 !important;
}

body[data-path="login"] section > .page-card-head .app-logo {
  display: block !important;
  width: 112px !important;
  height: 112px !important;
  max-height: none !important;
  max-width: none !important;
  margin: 0 auto 0.75rem !important;
  border-radius: 50% !important;
  box-shadow:
    0 0 0 4px rgba(251, 244, 230, 0.95),
    0 14px 32px rgba(61, 42, 24, 0.2) !important;
  object-fit: cover;
}

body[data-path="login"] section > .page-card-head h4 {
  font-family: var(--rw-font-display) !important;
  font-size: clamp(1.35rem, 3.5vw, 1.75rem) !important;
  font-weight: 650 !important;
  letter-spacing: -0.02em !important;
  color: var(--rw-ink) !important;
  text-align: center !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

/* Shared card for login / forgot / signup / email-link */
body[data-path="login"] .login-content.page-card,
body[data-path="login"] .page-card {
  width: min(100%, 400px) !important;
  max-width: 400px !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 1.4rem 1.45rem 1.25rem !important;
  background: rgba(251, 244, 230, 0.94) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.65) !important;
  border-radius: 22px !important;
  box-shadow: var(--rw-shadow) !important;
  color: var(--rw-ink) !important;
  display: block !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
}

/* Signup-disabled empty state */
body[data-path="login"] .for-signup .page-card-head + .page-card,
body[data-path="login"] .signup-disabled .page-card,
body[data-path="login"] .for-signup .page-card {
  text-align: center !important;
}

body[data-path="login"] .for-signup .page-card h4,
body[data-path="login"] .for-signup .page-card .page-card-head,
body[data-path="login"] .signup-disabled h4 {
  font-family: var(--rw-font-display) !important;
  font-size: 1.35rem !important;
  margin: 0 0 0.5rem !important;
  color: var(--rw-ink) !important;
}

body[data-path="login"] .for-signup .page-card p,
body[data-path="login"] .signup-disabled p {
  color: rgba(26, 16, 6, 0.65) !important;
  margin: 0 0 1.25rem !important;
  font-size: 0.98rem !important;
}

body[data-path="login"] .for-signup .btn,
body[data-path="login"] .for-forgot .btn-primary,
body[data-path="login"] .for-forgot button[type="submit"],
body[data-path="login"] .for-login-with-email-link .btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 10rem !important;
  height: 48px !important;
  padding: 0 1.4rem !important;
  border: none !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--rw-gold-glow), var(--rw-gold) 45%, var(--rw-gold-deep)) !important;
  color: var(--rw-ink) !important;
  font-family: var(--rw-font-body) !important;
  font-weight: 600 !important;
  box-shadow: 0 10px 24px rgba(168, 108, 46, 0.28) !important;
}

body[data-path="login"] .for-forgot .btn-primary,
body[data-path="login"] .for-forgot button[type="submit"],
body[data-path="login"] .for-login-with-email-link .btn-primary {
  width: 100% !important;
}

body[data-path="login"] .for-forgot .btn-back,
body[data-path="login"] .for-signup a,
body[data-path="login"] .for-login-with-email-link a {
  color: var(--rw-dust) !important;
}

.for-login .page-card-body,
.for-login .page-card-actions,
.for-login .login-content.page-card form,
.for-login .login-content.page-card .form-signin,
body[data-path="login"] .page-card-body,
body[data-path="login"] .page-card-actions {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.for-login .form-group,
body[data-path="login"] .form-group {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.for-login .email-field,
.for-login .password-field,
body[data-path="login"] .email-field,
body[data-path="login"] .password-field {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.for-login .form-control,
body[data-path="login"] .form-control,
.for-login input.form-control,
body[data-path="login"] input.form-control {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  height: 48px !important;
  padding: 0.65rem 2.75rem 0.65rem 2.6rem !important;
  background: #fff !important;
  border: 1px solid rgba(26, 16, 6, 0.16) !important;
  border-radius: 12px !important;
  color: var(--rw-ink) !important;
  font-family: var(--rw-font-body) !important;
  font-size: 1rem !important;
  box-shadow: inset 0 1px 2px rgba(26, 16, 6, 0.04) !important;
}

.for-login .field-icon,
body[data-path="login"] .field-icon {
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  opacity: 0.5 !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

.for-login .toggle-password,
body[data-path="login"] .toggle-password {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  z-index: 2 !important;
  cursor: pointer !important;
  font-size: 0.85rem !important;
  color: var(--rw-dust) !important;
  font-weight: 500 !important;
}

body[data-path="login"] .page-card form,
.for-login .page-card form {
  margin: 0 !important;
}

body[data-path="login"] label,
.for-login label,
body[data-path="login"] .form-group label {
  font-family: var(--rw-font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--rw-ink-soft) !important;
  margin-bottom: 0.4rem !important;
}

body[data-path="login"] .form-control:focus,
.for-login .form-control:focus {
  border-color: var(--rw-gold) !important;
  box-shadow: 0 0 0 4px rgba(196, 137, 58, 0.22) !important;
  outline: none !important;
  background: #fff !important;
}

body[data-path="login"] .form-group,
.for-login .form-group {
  margin-bottom: 1.1rem !important;
}

body[data-path="login"] .forgot-password-message,
.for-login .forgot-password-message {
  text-align: right !important;
  margin: -0.35rem 0 1.1rem !important;
}

body[data-path="login"] a,
.for-login a,
body[data-path="login"] .btn-forgot,
.for-login .forgot-password-message a {
  color: var(--rw-dust) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

body[data-path="login"] a:hover,
.for-login a:hover {
  color: var(--rw-earth) !important;
  text-decoration: underline !important;
}

/* Primary login CTA */
body[data-path="login"] .btn-login,
.for-login .btn-login,
body[data-path="login"] button.btn-login,
.for-login .page-card .btn.btn-primary {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 50px !important;
  margin-top: 0.35rem !important;
  padding: 0 1.25rem !important;
  border: none !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--rw-gold-glow), var(--rw-gold) 45%, var(--rw-gold-deep)) !important;
  color: var(--rw-ink) !important;
  font-family: var(--rw-font-body) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  box-shadow: 0 12px 28px rgba(168, 108, 46, 0.28) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

body[data-path="login"] .btn-login:hover,
.for-login .btn-login:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 16px 34px rgba(168, 108, 46, 0.36) !important;
}

/* “or” divider */
body[data-path="login"] .page-card > .social-logins,
.for-login .social-logins,
body[data-path="login"] .login-content .page-card p,
body[data-path="login"] .page-card .sign-up-message {
  color: rgba(26, 16, 6, 0.55) !important;
  font-size: 0.9rem !important;
}

body[data-path="login"] .page-card hr,
.for-login .page-card hr {
  border-color: var(--rw-line) !important;
  opacity: 1 !important;
}

/* Social / email-link block */
.for-login .social-logins,
body[data-path="login"] .social-logins {
  margin-top: 0.85rem !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

.for-login .login-divider,
body[data-path="login"] .login-divider {
  display: flex !important;
  align-items: center !important;
  gap: 0.85rem !important;
  margin: 0.85rem 0 !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(26, 16, 6, 0.4) !important;
}

.for-login .login-divider::before,
.for-login .login-divider::after,
body[data-path="login"] .login-divider::before,
body[data-path="login"] .login-divider::after {
  content: "" !important;
  flex: 1 !important;
  height: 1px !important;
  background: rgba(26, 16, 6, 0.14) !important;
}

.for-login .login-button-wrapper,
.for-login .social-login-buttons,
.for-login .login-with-email-link,
body[data-path="login"] .login-button-wrapper,
body[data-path="login"] .social-login-buttons,
body[data-path="login"] .login-with-email-link {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.for-login .login-with-email-link a.btn,
body[data-path="login"] .login-with-email-link a.btn,
.for-login a.btn-login-with-email-link,
.for-login .login-button-wrapper > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 1rem !important;
  background: transparent !important;
  border: 1.5px solid rgba(26, 16, 6, 0.22) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: var(--rw-ink) !important;
  font-family: var(--rw-font-body) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}

.for-login .login-with-email-link a.btn:hover,
body[data-path="login"] .login-with-email-link a.btn:hover {
  border-color: var(--rw-gold) !important;
  background: rgba(255, 250, 240, 0.75) !important;
  color: var(--rw-ink) !important;
  text-decoration: none !important;
}

/* Footer logo strip under card — keep subtle if present */
body[data-path="login"] .footer-logo,
.for-login .footer-logo {
  display: none !important;
}

@media (max-width: 480px) {
  .for-login .login-content.page-card,
  body[data-path="login"] .login-content.page-card {
    padding: 1.35rem 1.2rem 1.2rem !important;
    border-radius: 18px !important;
  }

  .for-login > .page-card-head .app-logo {
    width: 108px !important;
    height: 108px !important;
  }
}

/* ============================================================
   TRAVEL OS polish — desk feels like Roam Wild, not stock Frappe
   ============================================================ */

/* Sidebar section: "PUBLIC" → "On safari" */
body:not([data-path="login"]) .standard-sidebar-section[data-title="Public"] > .standard-sidebar-label .section-title {
  font-size: 0 !important;
  letter-spacing: 0 !important;
}
body:not([data-path="login"]) .standard-sidebar-section[data-title="Public"] > .standard-sidebar-label .section-title::after {
  content: "On safari";
  font-size: 0.68rem !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase;
  font-family: var(--rw-font-body);
  font-weight: 600;
  color: rgba(20, 10, 2, 0.45);
}

/* Nest child rail pages under Roam Wild with a quieter indent */
body:not([data-path="login"]) .sidebar-item-container[item-parent="Roam Wild"] {
  margin-left: 0.35rem;
}
body:not([data-path="login"]) .sidebar-item-container[item-parent="Roam Wild"] .sidebar-item-label {
  font-size: 0.92rem;
}

/* Kill generic workspace chrome: Edit / New / card kebabs */
body:not([data-path="login"]) .workspace-footer,
body:not([data-path="login"]) .btn-edit-workspace,
body:not([data-path="login"]) .workspace .page-actions .btn-secondary,
body:not([data-path="login"]) .number-widget-box .widget-control,
body:not([data-path="login"]) .number-widget-box .btn-group,
body:not([data-path="login"]) .number-widget-box .dropdown-btn,
body:not([data-path="login"]) .number-widget-box .setting-btn,
body:not([data-path="login"]) .chart-widget .widget-control,
body:not([data-path="login"]) .chart-widget .dropdown-btn,
body:not([data-path="login"]) .shortcut-widget-box .widget-control,
body:not([data-path="login"]) .links-widget-box .widget-control,
body:not([data-path="login"]) .widget .widget-control {
  display: none !important;
}

/* Metric cards — quieter, magazine-like */
body:not([data-path="login"]) .number-widget-box {
  padding: 1.1rem 1.15rem 1rem !important;
  background:
    linear-gradient(165deg, #fffdf8 0%, var(--rw-cream-soft) 55%, #f7ecd8 100%) !important;
  border: 1px solid rgba(107, 68, 32, 0.14) !important;
  min-height: 7.5rem;
}
body:not([data-path="login"]) .number-widget-box .widget-title {
  font-family: var(--rw-font-body) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: rgba(20, 10, 2, 0.48) !important;
}
body:not([data-path="login"]) .number-widget-box .widget-content .number {
  font-size: clamp(1.85rem, 3vw, 2.35rem) !important;
  line-height: 1.05 !important;
  color: var(--rw-gold-bright) !important;
  margin-top: 0.55rem !important;
}

/* Shortcut pills — travel CTA, not ERP chips */
body:not([data-path="login"]) .shortcut-widget-box {
  border-radius: 999px !important;
  padding: 0.65rem 1rem !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(196, 137, 58, 0.28) !important;
}
body:not([data-path="login"]) .shortcut-widget-box .widget-title {
  font-family: var(--rw-font-display) !important;
  font-size: 0.95rem !important;
  font-weight: 650 !important;
}
body:not([data-path="login"]) .shortcut-widget-box .indicator-pill,
body:not([data-path="login"]) .shortcut-widget-box .ellipsis {
  /* Count badges stay; mute the ERP grey */
  font-family: var(--rw-font-body) !important;
}

/* Workspace intro paragraph — not a grey info box */
body:not([data-path="login"]) .codex-editor .ce-paragraph,
body:not([data-path="login"]) .workspace .ce-paragraph,
body:not([data-path="login"]) [data-widget-name] .widget-body p,
body:not([data-path="login"]) .workspace-body .text-muted {
  color: rgba(20, 10, 2, 0.62) !important;
  font-size: 1.05rem !important;
  line-height: 1.55 !important;
  max-width: 40rem;
}

/* Soften paragraph / spacer blocks that Frappe wraps in cards */
body:not([data-path="login"]) .workspace .widget.spacer,
body:not([data-path="login"]) .workspace .codex-editor__redactor > .ce-block .widget:has(.ce-paragraph) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding-left: 0.15rem !important;
}

/* Workspace page title in head */
body:not([data-path="login"]) .workspace .page-title .title-text,
body:not([data-path="login"]) .workspace-title {
  font-family: var(--rw-font-display) !important;
}

/* Hide empty generic links widgets if any slip through */
body:not([data-path="login"]) .links-widget-box:empty {
  display: none !important;
}

/* List / form: quieter help text */
body:not([data-path="login"]) .help-box,
body:not([data-path="login"]) .form-message {
  background: rgba(196, 137, 58, 0.08) !important;
  border-color: var(--rw-line) !important;
  color: var(--rw-ink-soft) !important;
}
