@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;700;900&display=swap');

@tailwind base;
@tailwind components;

/* https://tailwindcss.com/docs/adding-custom-styles#removing-unused-custom-css */
@font-face {
  font-family: "LineK";
  src: url(/assets/LineK-20017fb89b1b37f30a103005bd10d458230f10ddb34389995d7ba15d30f7dfe8.ttf) format("truetype");
}

html {
  @apply subpixel-antialiased;
}

a {
  @apply text-very-peri;
}

li.nav {
  @apply bg-volcano-glass mx-1.5 my-1 font-serif;
}

.nav a {
  @apply text-primary;
}

table {
  @apply border-collapse table-fixed min-w-full;
}

/* cjk no wrap */
.stats th,
.stats td,
th {
  word-break: keep-all;
}

th,
td {
  @apply border border-collapse border-volcano-glass px-2 py-1;
}

thead th,
thead td {
  @apply bg-volcano-glass;
}

input,
button,
textarea {
  font-family: monospace;
  @apply text-lg text-anthracite;
}

select {
  font-family: monospace;
  @apply text-sm text-anthracite py-0;
}

.bg-gradient {
  @apply bg-gradient-to-r from-howthorn-rose to-elderberry bg-origin-border px-4 py-2 border border-transparent shadow-sm text-base font-medium text-cloud-dancer;
}

.search-button {
  @apply inline-flex items-center justify-center rounded-md border border-transparent bg-gradient shadow-sm focus:outline-none focus:ring-2 focus:ring-very-peri focus:ring-offset-2 sm:w-auto font-serif;
}

.alert-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  border-radius: 0;
}

a.navbar-logo {
  background-image: url(/assets/logo-compact-a9056524e77f364b34318a116c75d9c51d6216e6f738d2d835cf46f6c49fdade.png);
  width: 50px;
  height: 40px;
  background-size: 50px auto;
  padding: 0;
  margin-top: 2px;
}

a.navbar-logo:hover {
  background-position: 0 -50px;
}

.hero-wrap:before {
  content: " ";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.25;
  background-image: url(/assets/bgdeath-d8f88ca073a52587fe05b518bd72e32d46c0445f30c33d2f008507ba3db38432.jpg);
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
}

.apple_pagination {
  @apply text-center p-4 cursor-default;
}
.apple_pagination a,
.apple_pagination span {
  @apply py-1 px-1.5;
}
.apple_pagination .disabled {
  @apply text-volcano-glass;
}
.apple_pagination .current {
  @apply font-bold bg-cloud-dancer inline-block w-6 h-6 leading-6 shadow-sm shadow-anthracite;
}
.apple_pagination a {
  @apply no-underline text-secondary;
}
.apple_pagination a:hover,
.apple_pagination a:focus {
  @apply underline;
}

/* make sure utilities is here */
@tailwind utilities;

@layer base {
}

@layer components {
}
.navbar {
  /* background: linear-gradient(rgba(34, 34, 34, 0.95), rgba(34, 34, 34, 0.75)); */
  box-shadow: 0 2px 10px rgb(0 0 0 / 50%);
  z-index: 3;
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */