/*
 * Brand color override for the Purple Admin theme.
 * Loaded AFTER assets/css/vertical-light/style.css (or assets/css/style.css
 * on the auth/public layouts) on every page - Purple's own CSS/JS files are
 * left completely untouched, this file only re-points the "primary" brand
 * color used throughout the theme from purple to a medium dark blue.
 */
:root {
  --bs-primary: #0f3d73;
  --bs-primary-rgb: 15, 61, 115;
  --brand-blue: #0f3d73;
  --brand-blue-dark: #0a2a50;
  --brand-blue-light: #2f6db3;
}

a,
a:hover,
.text-primary,
.list-wrapper .completed .remove {
  color: var(--brand-blue) !important;
}

.bg-primary,
.settings-panel .color-tiles .tiles.primary,
.badge-primary {
  background-color: var(--brand-blue) !important;
  color: #fff !important;
}

.border-primary {
  border-color: var(--brand-blue) !important;
}

.btn-primary,
.wizard > .actions a {
  background-color: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
  color: #fff !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.wizard > .actions a:hover {
  background-color: var(--brand-blue-dark) !important;
  border-color: var(--brand-blue-dark) !important;
}
.btn-outline-primary {
  color: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
}
.btn-outline-primary:hover {
  background-color: var(--brand-blue) !important;
  color: #fff !important;
}

.btn-gradient-primary,
.btn-gradient-primary:not([disabled]):not(.disabled):active,
.btn-gradient-primary:not([disabled]):not(.disabled).active,
.show > .btn-gradient-primary.dropdown-toggle {
  background: linear-gradient(to right, #2f6db3, #0f3d73) !important;
}

.nav-tabs .nav-link.active,
.nav-pills .nav-link.active,
.nav-underline .nav-link.active,
.navbar-nav .nav-link.active,
.card-header-tabs .nav-link.active,
.sales-mini-tabs .nav-item .nav-link.active,
.nav-tabs.nav-tabs-vertical .nav-link.active,
.nav-tabs.nav-tabs-vertical-custom .nav-link.active,
.nav-pills.nav-pills-custom .nav-link.active,
.nav-pills-primary .nav-link.active {
  color: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
}

.form-control:focus,
.typeahead:focus,
.select2-container--bootstrap.select2-container--focus .select2-selection,
.select2-container--bootstrap .select2-dropdown {
  border-color: var(--brand-blue) !important;
  box-shadow: none !important;
}

.form-check-input:checked,
.custom-control-input:checked ~ .custom-control-label::before,
input[type="checkbox"]:checked {
  background-color: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
}

/* Sidebar - active menu item + hover accent */
.sidebar .nav-item.active > .nav-link,
.sidebar .nav-item .nav-link:hover {
  color: var(--brand-blue) !important;
}
.sidebar .nav-item.active > .nav-link .menu-icon,
.sidebar .nav-item .nav-link:hover .menu-icon,
.sidebar .nav-item.active > .nav-link .menu-title {
  color: var(--brand-blue) !important;
}
.sidebar .nav-item.active {
  border-left: 3px solid var(--brand-blue);
}

.brand-logo,
.navbar .navbar-brand-wrapper {
  background: transparent;
}

/* Status / workflow badges used across the Contracts module */
.badge-status-draft   { background-color: #9aa0a6 !important; color: #fff !important; }
.badge-status-issued  { background-color: #6f52c9 !important; color: #fff !important; }
.badge-status-sent    { background-color: var(--brand-blue-light) !important; color: #fff !important; }
.badge-status-signed  { background-color: #2e9e5b !important; color: #fff !important; }
.badge-status-void    { background-color: #c0392b !important; color: #fff !important; }

/* Contract document paper look, shared by preview / view / public sign page */
.contract-document {
  background: #fff;
  border: 1px solid #e6e2dd;
  border-radius: 4px;
  padding: 30px 36px;
  line-height: 1.65;
  font-size: 0.95rem;
  color: #2b2620;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}
.contract-document h4 {
  color: var(--brand-blue-dark);
  margin-bottom: 1.2rem;
}
.contract-document table.contract-signatures {
  margin-top: 2rem;
  border-collapse: collapse;
}
.contract-document table.contract-signatures td {
  vertical-align: top;
  padding: 10px;
}

.signature-pad-wrap {
  background: #fdfaf6;
  border: 2px dashed #d8b48b;
  border-radius: 6px;
  height: 180px;
  width: 100%;
  overflow: hidden;
  /* Mobile: without this, the browser treats a finger-drag starting on
     the canvas as a page pan/scroll/rubber-band gesture, competing with
     jSignature's own drawing handlers - that's what makes the whole
     page move left/right/up/down while trying to sign. touch-action:none
     tells the browser to hand ALL touch/pointer handling on this element
     to JS instead of its own default gestures. Belt-and-braces since
     jSignature (last updated years before passive-listener defaults
     became standard) may not itself call preventDefault effectively on
     modern browsers. */
  touch-action: none;
  -ms-touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.signature-pad-wrap canvas {
  touch-action: none;
  -ms-touch-action: none;
}
.signature-pad-wrap-sm {
  height: 140px;
}

/* -------------------------------------------------------------
   Full-screen signature modal (contract_sign/show.php)
   ------------------------------------------------------------- */
.signature-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: #fff;
  flex-direction: column;
  /* dvh accounts for mobile browser chrome (address bar) showing/hiding;
     100vh is the fallback for browsers that don't support dvh yet. */
  height: 100vh;
  height: 100dvh;
}
.signature-modal.is-open {
  display: flex;
}
.signature-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid #eee;
  font-weight: 600;
  flex-shrink: 0;
}
.signature-modal-close {
  border: none;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  color: #888;
  padding: 0 6px;
}
.signature-modal-body {
  flex: 1 1 auto;
  display: flex;
  padding: 12px;
  min-height: 0; /* required so a flex child can shrink below its content size and actually scroll/size correctly instead of overflowing */
}
.signature-modal-body .signature-pad-wrap {
  flex: 1 1 auto;
  height: auto; /* the fixed 180px default doesn't apply here - the pad fills whatever space the modal body has */
  width: 100%;
}
.signature-modal-footer {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding: 12px 16px;
  border-top: 1px solid #eee;
  flex-shrink: 0;
  /* iPhone home-indicator safe area */
  padding-bottom: calc(12px + env(safe-area-inset-bottom));
}

/* Locked onto <body> while the modal is open (see lockBodyScroll() in
   contracts.js) - position:fixed on body itself, not just
   overflow:hidden, is required to stop iOS Safari's background
   rubber-band scroll from reaching the page behind a fixed-position
   modal. */
body.signature-modal-open {
  overflow: hidden;
}

.signature-summary {
  display: flex;
  align-items: center;
  gap: 12px;
}
.signature-preview-img {
  max-height: 100px;
  border: 1px solid #d8b48b;
  border-radius: 6px;
  background: #fdfaf6;
}
.signature-placeholder {
  color: #999;
  font-style: italic;
}