/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* ----------------------------------------------------------------------------
 * RosterGeek Styles
 * ---------------------------------------------------------------------------- */

/* Might need ☃
 * ---------------------------------------------------------------------------- */
@charset "UTF-8";

/* Reset All Browsers - https://csstools.github.io/normalize.css/
 * ---------------------------------------------------------------------------- */
/* @import "normalize.css"; */

/* Variable definition
 * ---------------------------------------------------------------------------- */

:root {
  /* Abstractions */
  --color-bg: white;
  --color-text: black;
  --color-text-reversed: white;
  --color-text-subtle: var(--zinc-500);
  --color-link: var(--blue-700);
  --color-border-light: var(--zinc-100);
  --color-border: var(--zinc-200);
  --color-border-dark: var(--zinc-400);
  --color-selected: var(--blue-100);
  --color-selected-dark: var(--blue-300);
  --color-highlight: var(--yellow-200);

  /* Accent colors */
  --color-primary: #e93325;
  --color-primary-dark: #c72114;
  --color-primary-light: #eb493c;
  --color-secondary: var(--zinc-100);
  --color-negative: var(--red-600);
  --color-positive: var(--green-600);

  /* SVG color values */
  --color-filter-text: invert(0);
  --color-filter-text-reversed: invert(1);
  --color-filter-negative: invert(22%) sepia(85%) saturate(1790%)
    hue-rotate(339deg) brightness(105%) contrast(108%);
  --color-filter-positive: invert(44%) sepia(89%) saturate(409%)
    hue-rotate(89deg) brightness(94%) contrast(97%);

  /* Gray palette is provided by css-zero (colors.css). Standard convention:
   * --gray-50 = lightest, --gray-950 = darkest. */

  /* Brand-specific tokens */
  --green: #219613;
  --yellow: #ffd700;
  --red: var(--color-primary);

  --radius-small: 4px;
  --radius-medium: 8px;
  --radius-large: 16px;

  --input-background: var(--gray-50);
  --input-border-color: var(--gray-600);
  --input-radius: var(--radius-medium);
  --input-font-size: 20px;
  --input-inline-size: ;
  --input-block-size: ;
  --input-padding: 6px;

  --border-radius: 8px;
  --gap-size: 2em;
}

/* Fonts
 * ----------------------------------------------------------------------------
 * ATC Overlook — Avondale Type Co (commercial license).
 * https://avondaletypeco.com/atc-overlook/
 *
 * Loads all 7 weights × 2 styles (italic / non-italic). woff2 first
 * (covers ~97% of users), woff fallback for older Edge / Safari < 12.
 *
 * - font-display: swap shows fallback text immediately and swaps in the
 *   web font when ready, avoiding FOIT.
 * - local() prefix lets browsers skip the network if the user already has
 *   the font installed.
 *
 * Weight mapping (Avondale name -> CSS numeric):
 *   Thin       100
 *   ExtraLight 200
 *   Light      300
 *   Regular    400
 *   Medium     500
 *   Bold       700
 *   Heavy      900   (no Black ships in this family; Heavy is the apex)
 * ---------------------------------------------------------------------------- */

@font-face {
  font-family: "ATC Overlook";
  font-weight: 100; font-style: normal; font-display: swap;
  src: local("ATC Overlook Thin"),
       url("/assets/overlook/woff2/ATCOverlook-Thin-4975211c.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-Thin-59134db2.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 100; font-style: italic; font-display: swap;
  src: local("ATC Overlook Thin Italic"),
       url("/assets/overlook/woff2/ATCOverlook-ThinItalic-aa7e0987.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-ThinItalic-cea58ed2.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 200; font-style: normal; font-display: swap;
  src: local("ATC Overlook ExtraLight"),
       url("/assets/overlook/woff2/ATCOverlook-ExtraLight-4c258d3f.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-ExtraLight-aef6bf15.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 200; font-style: italic; font-display: swap;
  src: local("ATC Overlook ExtraLight Italic"),
       url("/assets/overlook/woff2/ATCOverlook-ExtraLightItalic-febb8c3a.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-ExtraLightItalic-1f2a989c.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 300; font-style: normal; font-display: swap;
  src: local("ATC Overlook Light"),
       url("/assets/overlook/woff2/ATCOverlook-Light-8e7a9f9d.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-Light-b9e7fed8.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 300; font-style: italic; font-display: swap;
  src: local("ATC Overlook Light Italic"),
       url("/assets/overlook/woff2/ATCOverlook-LightItalic-6c997865.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-LightItalic-8970b5eb.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 400; font-style: normal; font-display: swap;
  src: local("ATC Overlook Regular"), local("ATC Overlook"),
       url("/assets/overlook/woff2/ATCOverlook-Regular-cc35d212.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-Regular-46ec2678.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 400; font-style: italic; font-display: swap;
  src: local("ATC Overlook Regular Italic"), local("ATC Overlook Italic"),
       url("/assets/overlook/woff2/ATCOverlook-RegularItalic-44152860.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-RegularItalic-439a9cde.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 500; font-style: normal; font-display: swap;
  src: local("ATC Overlook Medium"),
       url("/assets/overlook/woff2/ATCOverlook-Medium-075480bb.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-Medium-bb0189fe.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 500; font-style: italic; font-display: swap;
  src: local("ATC Overlook Medium Italic"),
       url("/assets/overlook/woff2/ATCOverlook-MediumItalic-f83da176.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-MediumItalic-d5f3b52c.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 700; font-style: normal; font-display: swap;
  src: local("ATC Overlook Bold"),
       url("/assets/overlook/woff2/ATCOverlook-Bold-3cbcde92.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-Bold-4143a6ab.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 700; font-style: italic; font-display: swap;
  src: local("ATC Overlook Bold Italic"),
       url("/assets/overlook/woff2/ATCOverlook-BoldItalic-8b02b123.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-BoldItalic-a3b15dc4.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 900; font-style: normal; font-display: swap;
  src: local("ATC Overlook Heavy"),
       url("/assets/overlook/woff2/ATCOverlook-Heavy-52ca6496.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-Heavy-87e50c0c.woff") format("woff");
}
@font-face {
  font-family: "ATC Overlook";
  font-weight: 900; font-style: italic; font-display: swap;
  src: local("ATC Overlook Heavy Italic"),
       url("/assets/overlook/woff2/ATCOverlook-HeavyItalic-1d8b5dfb.woff2") format("woff2"),
       url("/assets/overlook/woff/ATCOverlook-HeavyItalic-a6ee1d87.woff") format("woff");
}

/* Components - mostly from CSS Zero https://github.com/lazaronixon/css-zero
 * Not called do to propshaft loading all the things independently
 * ---------------------------------------------------------------------------- */
/* @import "components/accordion.css";
@import "components/alert.css";
@import "components/avatar.css";
@import "components/badge.css";
@import "components/button.css";
@import "components/card.css";
@import "components/carousel.css";
@import "components/dialog.css";
@import "components/flash.css";
@import "components/input.css";
@import "components/menu.css";
@import "components/popover.css";
@import "components/switch.css";
@import "components/table.css";
@import "components/tabs.css";
@import "components/tooltip.css"; */

/* Main Element Import
 * ---------------------------------------------------------------------------- */
/* @import "layout.css";
@import "base.css"; */