/* ==========================================================================
   lolpos brand overrides - loaded on every CMS page, after cms.css
   Owned by lolpos. BardPOS updates overwrite cms.css wholesale; they cannot
   touch this file, so anything we need to hold across updates goes here.
   See CUSTOMISATIONS.md
   ========================================================================== */

:root {
    /* Sataloop Technologies palette. storefront.css declares the same values
       so the landing page still renders correctly if this file is missing. */
    --lp-brand: #01A4E7;         /* Sataloop cyan      */
    --lp-brand-rgb: 1, 164, 231;
    --lp-accent: #D91C5C;        /* Sataloop crimson   */
    --lp-accent-dark: #C4174F;
    --lp-accent-rgb: 217, 28, 92;
    --lp-green: #5CB849;         /* Sataloop green     */
    --lp-deep: #083646;          /* Sataloop deep teal */
}

/* --------------------------------------------------------------------------
   1. Solid calls to action use crimson, not cyan.
      White text on #01A4E7 lands around 3:1, which is below the readable
      threshold at these sizes - "Try For Free" was almost invisible against it.
      Crimson clears 4.6:1 and matches the hero button on the home page.
   -------------------------------------------------------------------------- */
.modern-navbar__cta--primary,
.modern-navbar__mobile-cta--primary {
    background-color: var(--lp-accent) !important;
    border-color: var(--lp-accent) !important;
    color: #ffffff !important;
    font-weight: 600;
}
.modern-navbar__cta--primary:hover,
.modern-navbar__mobile-cta--primary:hover {
    background-color: var(--lp-accent-dark) !important;
    border-color: var(--lp-accent-dark) !important;
    color: #ffffff !important;
}

.btn--primary {
    background-color: var(--lp-accent);
    border-color: var(--lp-accent);
    color: #ffffff;
}
.btn--primary:hover {
    background-color: var(--lp-accent-dark);
    border-color: var(--lp-accent-dark);
    color: #ffffff;
}

/* --------------------------------------------------------------------------
   2. Retire the leftover amber hovers cms.css still hard-codes.
      These were tied to the old #FFB600 theme and stayed amber no matter what
      colour the theme was set to.
   -------------------------------------------------------------------------- */
a:hover { color: var(--lp-brand); }
.prose a:hover { color: var(--lp-brand); }
body.dark-mode a:hover { color: var(--lp-brand); }