\usepackage{amsmath}
\usepackage{amssymb}
\usepackage{amsthm}
\usepackage[most]{tcolorbox}
\usepackage{emoji}
\usepackage{chessfss}
\usepackage{xcolor}

\definecolor{BlogCalloutNoteBack}{HTML}{FFF8D7}
\definecolor{BlogCalloutNoteFrame}{HTML}{D4A72C}
\definecolor{BlogCalloutTipBack}{HTML}{E7F6EC}
\definecolor{BlogCalloutTipFrame}{HTML}{3A8F64}
\definecolor{BlogCalloutWarningBack}{HTML}{FFF0E5}
\definecolor{BlogCalloutWarningFrame}{HTML}{C4662D}
\definecolor{BlogCalloutCautionBack}{HTML}{FDECEC}
\definecolor{BlogCalloutCautionFrame}{HTML}{B94A48}
\definecolor{BlogCalloutAsideBack}{HTML}{EEF3FA}
\definecolor{BlogCalloutAsideFrame}{HTML}{5D7FA3}

\tcbset{
  blog callout/.style={
    enhanced,
    breakable,
    boxrule=0.45pt,
    leftrule=2.2pt,
    arc=1.6mm,
    outer arc=1.6mm,
    left=7pt,
    right=7pt,
    top=6pt,
    bottom=6pt,
    before skip=10pt,
    after skip=10pt,
    fonttitle=\bfseries\sffamily\small,
    coltitle=black,
    attach boxed title to top left={xshift=7pt,yshift=-2.4mm},
    boxed title style={
      enhanced,
      boxrule=0pt,
      arc=1.2mm,
      left=5pt,
      right=5pt,
      top=2pt,
      bottom=2pt
    }
  }
}

\newtcolorbox{blognotebox}[2][]{
  blog callout,
  title={NOTE\if\relax\detokenize{#2}\relax\else: #2\fi},
  colback=BlogCalloutNoteBack,
  colframe=BlogCalloutNoteFrame,
  boxed title style={colback=BlogCalloutNoteBack},
  #1
}

\newtcolorbox{blogtipbox}[2][]{
  blog callout,
  title={TIP\if\relax\detokenize{#2}\relax\else: #2\fi},
  colback=BlogCalloutTipBack,
  colframe=BlogCalloutTipFrame,
  boxed title style={colback=BlogCalloutTipBack},
  #1
}

\newtcolorbox{blogwarningbox}[2][]{
  blog callout,
  title={WARNING\if\relax\detokenize{#2}\relax\else: #2\fi},
  colback=BlogCalloutWarningBack,
  colframe=BlogCalloutWarningFrame,
  boxed title style={colback=BlogCalloutWarningBack},
  #1
}

\newtcolorbox{blogcautionbox}[2][]{
  blog callout,
  title={CAUTION\if\relax\detokenize{#2}\relax\else: #2\fi},
  colback=BlogCalloutCautionBack,
  colframe=BlogCalloutCautionFrame,
  boxed title style={colback=BlogCalloutCautionBack},
  #1
}

\newtcolorbox{blogasidebox}[2][]{
  blog callout,
  title={ASIDE\if\relax\detokenize{#2}\relax\else: #2\fi},
  colback=BlogCalloutAsideBack,
  colframe=BlogCalloutAsideFrame,
  boxed title style={colback=BlogCalloutAsideBack},
  #1
}

\ExplSyntaxOn
\NewDocumentCommand{\BlogEmojiText}{m}{{\emoji_font: #1}}
\ExplSyntaxOff

\newcommand{\BlogChessWhite}[1]{\textcolor{black!55}{#1}}
\newcommand{\BlogChessBlack}[1]{\textcolor{black}{#1}}
\newcommand{\BlogCardRed}[1]{\textcolor{red!65!black}{#1}}
\newcommand{\BlogCardBlack}[1]{\textcolor{black}{#1}}

\theoremstyle{plain}
\newtheorem{theorem}{Theorem}
\newtheorem{lemma}[theorem]{Lemma}
\newtheorem{proposition}[theorem]{Proposition}
\newtheorem{corollary}[theorem]{Corollary}

\theoremstyle{definition}
\newtheorem{definition}[theorem]{Definition}
\newtheorem{example}[theorem]{Example}

\theoremstyle{remark}
\newtheorem{remark}[theorem]{Remark}

\newcommand{\SemanticLoadCleveref}{%
  \usepackage{cleveref}%
  \crefname{theorem}{theorem}{theorems}%
  \Crefname{theorem}{Theorem}{Theorems}%
  \crefname{lemma}{lemma}{lemmas}%
  \Crefname{lemma}{Lemma}{Lemmas}%
  \crefname{proposition}{proposition}{propositions}%
  \Crefname{proposition}{Proposition}{Propositions}%
  \crefname{corollary}{corollary}{corollaries}%
  \Crefname{corollary}{Corollary}{Corollaries}%
  \crefname{definition}{definition}{definitions}%
  \Crefname{definition}{Definition}{Definitions}%
  \crefname{example}{example}{examples}%
  \Crefname{example}{Example}{Examples}%
  \crefname{remark}{remark}{remarks}%
  \Crefname{remark}{Remark}{Remarks}%
  \crefname{figure}{figure}{figures}%
  \Crefname{figure}{Figure}{Figures}%
}

\makeatletter
\@ifpackageloaded{hyperref}{%
  \SemanticLoadCleveref
}{%
  \AddToHook{package/hyperref/after}{\SemanticLoadCleveref}%
}
\makeatother