/*
 * Farmland Toolbox (tnfarmland) look for EspoCRM: crm and crm-dev, and both partner portals.
 * Colours and logo: wordpress-sites tnfarmland.org/branding/BRAND-DECISIONS.md. Loaded after the theme's own
 * stylesheet (espocrm-configure.php part 7), so plain overrides win.
 *
 * The colours apply only to EspoCRM's default theme, "Espo" (the :has() guard below): someone who picks Dark or
 * another theme in their preferences keeps that theme as designed. The logo sizes apply to every theme.
 */

/* --- Colours (Espo theme) ---------------------------------------------------------------------------------------- */
:root:has(#main-stylesheet[href*="css/espo/espo.css"]) {
    /* Field: the main brand green. White on Field is 6.1:1. */
    --brand-primary: #5F663D;
    --brand-primary-5: #565C37;
    --brand-primary-10: #4C5131;
    --brand-primary-lighten-10: #7A8352;
    --brand-primary-lighten-30: #C9CDB0;
    --btn-primary-bg: #5F663D;
    --btn-primary-border: #5F663D;
    --btn-primary-hover-bg: #4C5131;
    --btn-primary-hover-border: #4C5131;
    --btn-primary-active-bg: #41452A;
    --btn-primary-active-border: #3B3F26;
    --input-border-focus: #7A8352;
    --input-border-focus-rgba: rgba(95, 102, 61, 0.45);

    /* River: links (5.9:1 on Limestone, more on white). */
    --link-color: #285E9E;
    --text-link-color: #285E9E;
    --text-link-hover-color: #1D4675;

    /* Limestone: the page and the side menu, in place of the theme's cool grey. */
    --body-bg: #F4F2EC;
    --navbar-bg: #F4F2EC;
    --navbar-inverse-bg: #F4F2EC;
    --navbar-inverse-border: #E2DFD5;
    --navbar-inverse-link-hover-bg: #ECE9E0;
    --navbar-inverse-link-active-bg: #E2E0D2;
    --navbar-inverse-toggle-hover-bg: #E2E0D2;
    --navbar-inverse-bg-7: #E6E3D8;
}

/* --- Logo: the stacked lockup (the barn, TENNESSEE, Farmland Toolbox), 3.15 : 1 ----------------------------------- */
/* EspoCRM sizes its logo boxes for a wide 4 : 1 wordmark (181 x 43 on the sign-in page, 182 x 40 in the side menu),
   which would shrink this lockup's name to about 12 px. */
#login .logo-container {
    width: auto;
    height: auto;
    padding: 24px 24px 12px;
    overflow: visible;
    text-align: center;
}
#login .logo-container img.logo {
    height: 84px;
    max-height: none;
    width: auto;
    max-width: 100%;
}

/* Side menu, open (the default layout on a computer): 56 px tall (177 px wide) inside the menu's 65 px header, instead
   of 40 px. The collapsed menu shows no logo, and the menu that opens over a collapsed one keeps EspoCRM's size. */
@media (min-width: 768px) {
    body[data-navbar=side]:not(.minimized) #navbar .navbar-header {
        padding-top: 4px;
        padding-bottom: 5px;
    }
    body[data-navbar=side]:not(.minimized) #navbar .navbar-logo-container {
        height: 56px;
    }
    body[data-navbar=side]:not(.minimized) #navbar a.navbar-brand,
    body[data-navbar=side]:not(.minimized) #navbar .navbar-brand img {
        height: 56px !important;
    }
}

/* --- Sign-in page: the Authentik button is the main action, so it gets the primary colour -------------------------- */
#login #sign-in {
    background-color: var(--btn-primary-bg);
    border-color: var(--btn-primary-border);
    color: var(--btn-primary-color, #fff);
}
#login #sign-in:hover,
#login #sign-in:focus {
    background-color: var(--btn-primary-hover-bg);
    border-color: var(--btn-primary-hover-border);
    color: var(--btn-primary-color, #fff);
}