/* source-sans-3-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/source-sans-3-v18-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 300;
  src: url('/fonts/source-sans-3-v18-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/source-sans-3-v18-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 600;
  src: url('/fonts/source-sans-3-v18-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/source-sans-3-v18-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 700;
  src: url('/fonts/source-sans-3-v18-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


:root {
    --color-bg: #2b2f33;
    --color-ok: #14b8ca;
    --color-ok-hover: #14b2c5;
    --color-ok-text: #fff;
    --color-cancel: #ccc;
    --color-cancel-hover: #bbb;
    --color-delete: #8f0f0f;
    --color-delete-hover: #760c0c;
    --color-bg-lmnhq-panel: #f2f3f5;
    --color-link: #000;
    --color-text: #333;
    --color-text-small: #555;
    --color-input-bg: #fff;
    --color-input-border: #d2d6de;
    --color-input-border-focused: var(--color-ok);
    --color-box-shadow: rgba(0, 0, 0, 0.2);
    --color-nav: #15283f;
    --color-nav-hover: var(--color-ok-hover);
    --color-avatar-nav-hover: #fafafa;
    --color-cta: var(--color-nav);

    --color--flash-message--bg--error: rgb(255, 203, 213);
    --color--flash-message--fg--error: var(--color-text);

    --color-background-white: #fcfcfc;

    --color-button-text-disabled: #bbb;
    --color-button-background-disabled: #fafafa;
    --container-border-radius: 0.3rem;

    --padding-panel: 1rem;
    --padding-input-x: 0.5rem;
    --padding-input-y: 0;

    --width-input-border: 1px;
    --width-nav: 13rem;
    --width-nav-collapsed: calc(var(--height-line) + (var(--padding-panel) * 2));
    --width-lmnhq-panel: 28rem;
    --width-alert: 90%;
    --width-alert-max: 25rem;

    --height-header: 5rem;
    --height-line: 1.65rem;
    --height-line-small: 1.2rem;
    --height-input-field: 2rem;

    --font-family: "Source Sans 3", sans-serif;
    --font-size: 16px;
    --font-size-small: 0.8em;
    --font-weight-normal: 300;
    --font-weight-bold: 600;
    --font-weight-bolder: 700;
}

h1 a,
main > section > input[type="checkbox"]:checked ~ label:nth-of-type(2):before {
    background-image: url("/img/logotype.svg");
}

h1:before,
lmnhq-panel[name="login"]:before,
lmnhq-panel[name="404"]:before,
main > section > input[type="checkbox"]:checked ~ label:nth-of-type(2):after {
    background-image: url("/img/logo.svg");
}

body,
.cards:empty:before,
lmnhq-paginated-items:empty:before {
    background-image: url("/img/bg.png");
}

lmnhq-panel[name="404"]::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    opacity: 0.1;
    width: 100%;
    height: 100%;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
    margin: 0;
}

lmnhq-panel[name="404"] h2 {
    background: none;
    border-bottom-width: 0;
    border-top: 1px solid var(--color-input-border);
    margin-top: var(--padding-panel);
    margin-bottom: 0;
    text-align: center;
}

lmnhq-panel[name="404"] h2::before {
    content: none;
}

lmnhq-panel[name="404"] p {
    margin: 0 0 var(--padding-panel) 0;
    text-align: center;
}
