/* Veritable Pantheon skin for SFTPGo (web client + admin). Loaded after the Metronic bundle through
   branding.extra_css, so it only re-points theme tokens: PAPER (light) and NOIR (dark) from VPPS2's
   styles.css, Georgia for the UI, near-square corners, brand red for links and the header rule, sage
   for buttons and navigation. Survives SFTPGo upgrades; nothing here touches its templates. */

:root, [data-bs-theme="light"] {
  --vp-bg: #f6f5f1; --vp-panel: #ffffff; --vp-panel2: #f0efe9; --vp-panel3: #e6e4dc;
  --vp-line: #e0ded6; --vp-line2: #cbc8bd; --vp-text: #22242a; --vp-muted: #5f6470; --vp-dim: #8b90a0;
  --vp-brand: #9c1c1f; --vp-brand-rgb: 156,28,31; --vp-sage: #a3b184; --vp-sage-rgb: 163,177,132; --vp-sage-active: #8e9d70; --vp-sage-ink: #ffffff; --vp-sage-soft: #eef1e6;
  --vp-green: #2f9e44; --vp-green-rgb: 47,158,68; --vp-amber: #c07a12; --vp-amber-rgb: 192,122,18; --vp-red: #d63b3b; --vp-red-rgb: 214,59,59; --vp-blue: #2f6bd6; --vp-blue-rgb: 47,107,214;
  --vp-text-rgb: 34,36,42; --vp-bg-rgb: 246,245,241; --vp-panel2-rgb: 240,239,233; --vp-panel3-rgb: 230,228,220;

  --bs-body-bg: var(--vp-bg); --bs-body-bg-rgb: var(--vp-bg-rgb); --bs-app-bg-color: var(--vp-bg); --bs-body-color: var(--vp-text); --bs-body-color-rgb: var(--vp-text-rgb);
  --bs-card-bg: var(--vp-panel); --bs-app-header-base-bg-color: var(--vp-panel); --bs-app-sidebar-base-bg-color: var(--vp-panel2);
  --bs-app-footer-bg-color: var(--vp-bg); --bs-dropdown-bg: var(--vp-panel); --bs-modal-bg: var(--vp-panel);
  --bs-input-bg: var(--vp-panel); --bs-input-color: var(--vp-text);
  --bs-border-color: var(--vp-line); --bs-card-border-color: var(--vp-line); --bs-border-dashed-color: var(--vp-line2);
  --bs-gray-100: #f0efe9; --bs-gray-200: #e6e4dc; --bs-gray-300: #e0ded6; --bs-gray-400: #cbc8bd; --bs-gray-500: #8b90a0;
  --bs-gray-600: #5f6470; --bs-gray-700: #4a4f5c; --bs-gray-800: #22242a; --bs-gray-900: #15171c;
  --bs-text-gray-100: #f0efe9; --bs-text-gray-200: #e6e4dc; --bs-text-gray-300: #e0ded6; --bs-text-gray-400: #cbc8bd; --bs-text-gray-500: #8b90a0;
  --bs-text-gray-600: #5f6470; --bs-text-gray-700: #4a4f5c; --bs-text-gray-800: #22242a; --bs-text-gray-900: #15171c;
  --bs-text-muted: var(--vp-muted); --bs-text-dark: var(--vp-text); --bs-heading-color: var(--vp-text);
  --bs-primary: var(--vp-sage); --bs-primary-rgb: var(--vp-sage-rgb); --bs-primary-active: var(--vp-sage-active); --bs-primary-light: var(--vp-sage-soft); --bs-primary-inverse: var(--vp-sage-ink);
  --bs-text-primary: var(--vp-brand); --bs-link-color: var(--vp-brand); --bs-link-color-rgb: var(--vp-brand-rgb); --bs-link-hover-color: var(--vp-brand); --bs-link-hover-color-rgb: var(--vp-brand-rgb);
  --bs-secondary: var(--vp-panel3); --bs-secondary-rgb: var(--vp-panel3-rgb); --bs-light: var(--vp-panel2); --bs-light-rgb: var(--vp-panel2-rgb); --bs-light-active: var(--vp-panel3);
  --bs-menu-link-color-active: var(--vp-brand); --bs-menu-link-bg-color-active: var(--vp-sage-soft);
  --bs-menu-link-color-hover: var(--vp-text); --bs-menu-link-bg-color-hover: var(--vp-panel2);
  --bs-table-color: var(--vp-text); --bs-table-bg: transparent; --bs-scrollbar-color: var(--vp-line2);
  --bs-success: var(--vp-green); --bs-success-rgb: var(--vp-green-rgb); --bs-warning: var(--vp-amber); --bs-warning-rgb: var(--vp-amber-rgb);
  --bs-danger: var(--vp-red); --bs-danger-rgb: var(--vp-red-rgb); --bs-info: var(--vp-blue); --bs-info-rgb: var(--vp-blue-rgb);
  --bs-border-radius: 1px; --bs-border-radius-sm: 1px; --bs-border-radius-lg: 1px; --bs-border-radius-xl: 1px; --bs-border-radius-2xl: 1px; --bs-card-border-radius: 1px;
}

[data-bs-theme="dark"] {
  --vp-bg: #0a0a0b; --vp-panel: #141416; --vp-panel2: #1b1b1e; --vp-panel3: #252528;
  --vp-line: #242427; --vp-line2: #343437; --vp-text: #ededee; --vp-muted: #8d8d92; --vp-dim: #5a5a5f;
  --vp-brand: #d15458; --vp-brand-rgb: 209,84,88; --vp-sage: #8fae7a; --vp-sage-rgb: 143,174,122; --vp-sage-active: #7f9c6b; --vp-sage-ink: #0f1408; --vp-sage-soft: #1d221a;
  --vp-green: #8fae7a; --vp-green-rgb: 143,174,122; --vp-amber: #e0b45c; --vp-amber-rgb: 224,180,92; --vp-red: #d66a5a; --vp-red-rgb: 214,106,90; --vp-blue: #c9a24b; --vp-blue-rgb: 201,162,75;
  --vp-text-rgb: 237,237,238; --vp-bg-rgb: 10,10,11; --vp-panel2-rgb: 27,27,30; --vp-panel3-rgb: 37,37,40;

  --bs-body-bg: var(--vp-bg); --bs-body-bg-rgb: var(--vp-bg-rgb); --bs-app-bg-color: var(--vp-bg); --bs-body-color: var(--vp-text); --bs-body-color-rgb: var(--vp-text-rgb);
  --bs-card-bg: var(--vp-panel); --bs-app-header-base-bg-color: var(--vp-panel); --bs-app-sidebar-base-bg-color: var(--vp-panel2);
  --bs-app-footer-bg-color: var(--vp-bg); --bs-dropdown-bg: var(--vp-panel); --bs-modal-bg: var(--vp-panel);
  --bs-input-bg: var(--vp-panel2); --bs-input-color: var(--vp-text);
  --bs-border-color: var(--vp-line); --bs-card-border-color: var(--vp-line); --bs-border-dashed-color: var(--vp-line2);
  --bs-gray-100: #1b1b1e; --bs-gray-200: #252528; --bs-gray-300: #343437; --bs-gray-400: #5a5a5f; --bs-gray-500: #8d8d92;
  --bs-gray-600: #a8a8ae; --bs-gray-700: #c6c6cb; --bs-gray-800: #ededee; --bs-gray-900: #ffffff;
  --bs-text-gray-100: #1b1b1e; --bs-text-gray-200: #252528; --bs-text-gray-300: #343437; --bs-text-gray-400: #5a5a5f; --bs-text-gray-500: #8d8d92;
  --bs-text-gray-600: #a8a8ae; --bs-text-gray-700: #c6c6cb; --bs-text-gray-800: #ededee; --bs-text-gray-900: #ffffff;
  --bs-text-muted: var(--vp-muted); --bs-text-dark: var(--vp-text); --bs-heading-color: var(--vp-text);
  --bs-primary: var(--vp-sage); --bs-primary-rgb: var(--vp-sage-rgb); --bs-primary-active: var(--vp-sage-active); --bs-primary-light: var(--vp-sage-soft); --bs-primary-inverse: var(--vp-sage-ink);
  --bs-text-primary: var(--vp-brand); --bs-link-color: var(--vp-brand); --bs-link-color-rgb: var(--vp-brand-rgb); --bs-link-hover-color: var(--vp-brand); --bs-link-hover-color-rgb: var(--vp-brand-rgb);
  --bs-secondary: var(--vp-panel3); --bs-secondary-rgb: var(--vp-panel3-rgb); --bs-light: var(--vp-panel2); --bs-light-rgb: var(--vp-panel2-rgb); --bs-light-active: var(--vp-panel3);
  --bs-menu-link-color-active: var(--vp-brand); --bs-menu-link-bg-color-active: var(--vp-sage-soft);
  --bs-menu-link-color-hover: var(--vp-text); --bs-menu-link-bg-color-hover: var(--vp-panel2);
  --bs-table-color: var(--vp-text); --bs-table-bg: transparent; --bs-scrollbar-color: var(--vp-line2);
  --bs-success: var(--vp-green); --bs-success-rgb: var(--vp-green-rgb); --bs-warning: var(--vp-amber); --bs-warning-rgb: var(--vp-amber-rgb);
  --bs-danger: var(--vp-red); --bs-danger-rgb: var(--vp-red-rgb); --bs-info: var(--vp-blue); --bs-info-rgb: var(--vp-blue-rgb);
}

/* Type: Metronic pins Inter on html/body with !important, so the family is pinned back here. */
html, body { font-family: Georgia, 'Times New Roman', 'Iowan Old Style', serif !important; }

/* Near-square chrome everywhere Metronic hard-codes a radius. */
.btn, .form-control, .form-select, .card, .modal-content, .dropdown-menu, .menu-sub-dropdown, .alert, .badge, .nav-pills .nav-link, .table-responsive, .input-group, .input-group-text, .symbol > img, .symbol-label, .toast, .popover, .tooltip-inner, .rounded, .rounded-1, .rounded-2, .rounded-3, .rounded-4, .form-check-input, .progress, .pagination .page-link {
  border-radius: 1px !important;
}
.btn { --bs-btn-border-radius: 1px; }
.shadow, .shadow-sm, .shadow-lg, .card, .app-header, .app-sidebar, .dropdown-menu, .menu-sub-dropdown { box-shadow: none !important; }

/* The mark: the Veritable Pantheon wordmark PNG, scaled to fit its slot. */
img[alt="Logo"] { height: auto !important; width: 100%; max-width: 100%; max-height: 64px; object-fit: contain; object-position: left center; }
.app-sidebar-logo img[alt="Logo"], .app-header-logo img[alt="Logo"] { max-height: 28px; width: auto; }

/* Login card (app-blank) and panels. */
.app-blank .bg-body { background: var(--vp-panel) !important; border: 1px solid var(--vp-line); }
body, .app-blank { background: var(--vp-bg) !important; }
.app-header { border-bottom: 2px solid var(--vp-brand) !important; }
.app-sidebar { border-right: 1px solid var(--vp-line) !important; }
.card { border: 1px solid var(--vp-line) !important; }
.card-header { border-bottom: 1px solid var(--vp-line) !important; }
.card-title, .card-label, h1, h2, h3, h4, h5, .fs-2, .fs-3 { color: var(--vp-text) !important; font-weight: 600 !important; }
.menu-title { color: var(--vp-muted); }
.menu-item.here > .menu-link .menu-title, .menu-link.active .menu-title { color: var(--vp-brand) !important; }
.form-control.form-control-solid, .form-select.form-select-solid { border: 1px solid var(--vp-line) !important; }
.form-control:focus, .form-select:focus { border-color: var(--vp-line2) !important; box-shadow: none !important; }

/* Buttons: sage primary, text on hover never drops below the text colour. */
.btn-primary { background-color: var(--vp-sage) !important; border-color: var(--vp-sage) !important; color: var(--vp-sage-ink) !important; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active { background-color: var(--vp-sage-active) !important; border-color: var(--vp-sage-active) !important; }
.btn-light-primary { background-color: var(--vp-sage-soft) !important; color: var(--vp-text) !important; }
.btn-light-primary:hover { background-color: var(--vp-sage) !important; color: var(--vp-sage-ink) !important; }
.btn-active-light-primary:hover, .btn-active-light-primary.active, .btn-active-light-primary:focus { color: var(--vp-text) !important; background-color: var(--vp-sage-soft) !important; }
.btn-active-light-primary:hover i, .btn-active-light-primary.active i { color: var(--vp-brand) !important; }

/* Tables: VPPS eyebrow headers, hairline rows. */
.table thead th { color: var(--vp-muted) !important; font-size: .85rem; letter-spacing: .06em; text-transform: uppercase; }
.table > :not(caption) > * > * { border-bottom-color: var(--vp-line) !important; }
.table.table-row-dashed tr { border-bottom-style: solid !important; border-bottom-color: var(--vp-line) !important; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
.text-hover-primary:hover { color: var(--vp-brand) !important; }

/* Paper sidebar: Metronic hard-codes a dark rail; in light mode use the paper tones. */
:root:not([data-bs-theme="dark"]) .app-sidebar .text-sidebar { color: var(--vp-text) !important; }
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link .menu-title { color: var(--vp-muted) !important; }
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link .menu-icon,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link .menu-icon i,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link .menu-icon .svg-icon { color: var(--vp-dim) !important; }
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link:hover,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link:hover .menu-title,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link:hover .menu-icon i { color: var(--vp-text) !important; }
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link.active,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item.here > .menu-link { background-color: var(--vp-sage-soft) !important; }
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link.active .menu-title,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-link.active .menu-icon i,
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item.here > .menu-link .menu-title { color: var(--vp-brand) !important; }
:root:not([data-bs-theme="dark"]) .app-sidebar-navs .menu .menu-item .menu-heading { color: var(--vp-dim) !important; }

/* Pagination: sage page, brand hover. */
.page-item.active .page-link, .active > .page-link, .page-link.active { background-color: var(--vp-sage) !important; color: var(--vp-sage-ink) !important; border-color: var(--vp-sage) !important; }
.page-item:hover:not(.active):not(.disabled) .page-link { color: var(--vp-brand) !important; }

.dropdown-menu, .menu-sub-dropdown { border: 1px solid var(--vp-line) !important; }
