/* p100.cz — only what Tailwind can't / shouldn't handle.
   Tailwind via CDN (see index.html) covers layout & colors. */

[hidden] { display: none !important; }

/* Avoid white flash at edges of overscroll */
html { background: rgb(249 250 251); }
html.dark { background: rgb(17 24 39); }

/* Form controls — ensure visible border (Tailwind CDN without @forms plugin
   doesn't draw a default border, only sets the color). */
input, select, textarea {
  border-width: 1px;
  border-style: solid;
}
input:focus, select:focus, textarea:focus {
  outline: 2px solid rgb(59 130 246);
  outline-offset: -1px;
}

/* === Tab buttons in main header === */
.tab {
  color: rgb(107 114 128);
}
.dark .tab {
  color: rgb(156 163 175);
}
.tab:hover {
  background: rgb(243 244 246);
}
.dark .tab:hover {
  background: rgb(55 65 81);
}
.tab.active {
  background: rgb(37 99 235);   /* blue-600 */
  color: white;
}
.dark .tab.active {
  background: rgb(96 165 250);  /* blue-400 */
  color: rgb(17 24 39);
}

/* === Year tabs (history) === */
.year-tab {
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 500;
  color: rgb(107 114 128);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color .15s, border-color .15s;
}
.dark .year-tab {
  color: rgb(156 163 175);
}
.year-tab:hover {
  color: rgb(31 41 55);
}
.dark .year-tab:hover {
  color: rgb(229 231 235);
}
.year-tab.active {
  color: rgb(37 99 235);
  border-bottom-color: rgb(37 99 235);
}
.dark .year-tab.active {
  color: rgb(96 165 250);
  border-bottom-color: rgb(96 165 250);
}
.year-tab .count {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 7px;
  font-size: 11px;
  font-weight: 400;
  border-radius: 9px;
  background: rgb(229 231 235);
  color: rgb(107 114 128);
}
.dark .year-tab .count {
  background: rgb(55 65 81);
  color: rgb(156 163 175);
}
.year-tab.active .count {
  background: rgb(219 234 254);
  color: rgb(37 99 235);
}
.dark .year-tab.active .count {
  background: rgba(96, 165, 250, 0.2);
  color: rgb(96 165 250);
}

.year-panel { display: none; }
.year-panel.active { display: block; }

/* === Toast variants === */
#toast.ok  { background: rgb(5 150 105); }
#toast.err { background: rgb(185 28 28); }
#toast a   { color: rgb(147 197 253); text-decoration: underline; }

/* === Items rows (table-less inside Tailwind card) === */
.items-row td {
  padding: 4px 0 8px;
  vertical-align: top;
}
