/* =====================================================================
   Dodatak uz gotove stilove portala.

   Portal je koristio biblioteku antd, koja svoje stilove nije stavljala
   u CSS fajl nego ih je ubacivala iz JavaScript-a dok se strana crta.
   Tih stilova zato u portal.css nema, pa su ovde ponovo napisani — samo
   za ono što portal stvarno koristi: birač datuma, padajuću listu,
   dugme sa olovkom, polja za ime i komentar i vrtešku učitavanja.

   Ispod toga su obaveštenja („Podešavanja sačuvana", „Vaga je dodata"),
   koja je ranije crtala biblioteka react-notification-system.
   ===================================================================== */

:root {
  --antd-glavna: #1677ff;
  --antd-ivica: #d9d9d9;
  --antd-ivica-hover: #4096ff;
  --antd-tekst: rgba(0, 0, 0, 0.88);
  --antd-tiho: rgba(0, 0, 0, 0.45);
  --antd-prazno: rgba(0, 0, 0, 0.25);
}

/* ---------- OPŠTA POLJA (Input, TextArea) ---------- */

.ant-input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding: 4px 11px;
  color: var(--antd-tekst);
  font-size: 14px;
  line-height: 1.5714285714285714;
  background-color: #fff;
  border: 1px solid var(--antd-ivica);
  border-radius: 6px;
  transition: all 0.2s;
}
.ant-input::placeholder { color: var(--antd-prazno); }
.ant-input:hover { border-color: var(--antd-ivica-hover); }
.ant-input:focus {
  border-color: var(--antd-glavna);
  box-shadow: 0 0 0 2px rgba(5, 145, 255, 0.1);
  outline: 0;
}
textarea.ant-input { resize: vertical; min-height: 32px; }
.ant-input.full-width { width: 100%; }

/* ---------- DUGME (olovka u „Detalji vage") ---------- */

.ant-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 32px;
  padding: 4px 15px;
  font-size: 14px;
  line-height: 1.5714285714285714;
  color: var(--antd-tekst);
  background: #fff;
  border: 1px solid var(--antd-ivica);
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
}
.ant-btn:hover { color: var(--antd-ivica-hover); border-color: var(--antd-ivica-hover); }
.ant-btn:active { color: #0958d9; border-color: #0958d9; }
.ant-btn[disabled], .ant-btn[disabled]:hover {
  color: var(--antd-prazno);
  border-color: var(--antd-ivica);
  background: rgba(0, 0, 0, 0.04);
  cursor: not-allowed;
  box-shadow: none;
}

/* ---------- IKONICE (olovka, kvačica, vrteška) ---------- */

.anticon { display: inline-flex; align-items: center; line-height: 0; }
.anticon svg { width: 1em; height: 1em; fill: currentColor; }

.anticon-loading { animation: antd-vrti 1s linear infinite; }
@keyframes antd-vrti { to { transform: rotate(360deg); } }

/* ---------- PADAJUĆA LISTA (Prikaz, izvor merenja) ---------- */

.ant-select {
  position: relative;
  display: inline-block;
  font-size: 14px;
  color: var(--antd-tekst);
  vertical-align: middle;
}
.ant-select-selector {
  display: flex;
  align-items: center;
  height: 32px;
  padding: 0 11px;
  background: #fff;
  border: 1px solid var(--antd-ivica);
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s;
}
.ant-select:hover .ant-select-selector { border-color: var(--antd-ivica-hover); }
.ant-select.otvoren .ant-select-selector {
  border-color: var(--antd-glavna);
  box-shadow: 0 0 0 2px rgba(5, 145, 255, 0.1);
}
.ant-select-selection-item {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 30px;
}
.ant-select-arrow {
  margin-left: 8px;
  color: var(--antd-prazno);
  font-size: 12px;
  line-height: 1;
  pointer-events: none;
}
.ant-select-dropdown {
  position: absolute;
  z-index: 1050;
  top: calc(100% + 4px);
  left: 0;
  min-width: 100%;
  padding: 4px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12),
    0 9px 28px 8px rgba(0, 0, 0, 0.05);
}
.ant-select-item {
  padding: 5px 12px;
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
}
.ant-select-item:hover { background: rgba(0, 0, 0, 0.04); }
.ant-select-item-option-selected { background: #e6f4ff; font-weight: 600; }

/* ---------- BIRAČ DATUMA (Kalendar: od — do) ---------- */

.ant-picker {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 4px 11px;
  background: #fff;
  border: 1px solid var(--antd-ivica);
  border-radius: 6px;
  transition: all 0.2s;
  font-size: 14px;
}
.ant-picker:hover { border-color: var(--antd-ivica-hover); }
.ant-picker.otvoren {
  border-color: var(--antd-glavna);
  box-shadow: 0 0 0 2px rgba(5, 145, 255, 0.1);
}
.ant-picker-input { position: relative; display: inline-flex; align-items: center; width: 96px; }
.ant-picker-input > input {
  width: 100%;
  padding: 0;
  color: var(--antd-tekst);
  font-size: 14px;
  line-height: 1.5714285714285714;
  background: transparent;
  border: 0;
  outline: 0;
  text-align: center;
  cursor: pointer;
}
.ant-picker-input > input::placeholder { color: var(--antd-prazno); }
.ant-picker-range-separator { padding: 0 8px; color: var(--antd-tiho); }
.ant-picker-suffix { margin-left: 8px; color: var(--antd-prazno); }

.ant-picker-dropdown {
  position: absolute;
  z-index: 1050;
  top: calc(100% + 6px);
  left: 0;
  display: flex;
  gap: 0;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12),
    0 9px 28px 8px rgba(0, 0, 0, 0.05);
  padding: 4px;
}
.ant-picker-panel { padding: 8px 12px 12px; min-width: 252px; }
.ant-picker-panel + .ant-picker-panel { border-left: 1px solid rgba(5, 5, 5, 0.06); }
.ant-picker-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0 8px;
  color: var(--antd-tekst);
  font-weight: 600;
}
.ant-picker-header button {
  min-width: 24px;
  padding: 0 4px;
  color: var(--antd-prazno);
  background: transparent;
  border: 0;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
}
.ant-picker-header button:hover { color: var(--antd-tekst); }
.ant-picker-content { width: 100%; border-collapse: collapse; }
.ant-picker-content th {
  width: 32px;
  height: 30px;
  color: var(--antd-tekst);
  font-weight: 400;
  font-size: 13px;
  text-align: center;
}
.ant-picker-cell {
  padding: 3px 0;
  color: var(--antd-prazno);
  cursor: pointer;
  text-align: center;
}
.ant-picker-cell-in-view { color: var(--antd-tekst); }
.ant-picker-cell .ant-picker-cell-inner {
  display: block;
  width: 30px;
  height: 30px;
  margin: 0 auto;
  line-height: 30px;
  border-radius: 6px;
  font-size: 13px;
}
.ant-picker-cell:hover .ant-picker-cell-inner { background: rgba(0, 0, 0, 0.04); }
.ant-picker-cell-today .ant-picker-cell-inner { box-shadow: inset 0 0 0 1px var(--antd-glavna); }
.ant-picker-cell-in-range .ant-picker-cell-inner { background: #e6f4ff; border-radius: 0; }
.ant-picker-cell-selected .ant-picker-cell-inner,
.ant-picker-cell-range-start .ant-picker-cell-inner,
.ant-picker-cell-range-end .ant-picker-cell-inner {
  background: var(--antd-glavna);
  color: #fff;
}
.ant-picker-cell-disabled { color: var(--antd-prazno); cursor: not-allowed; }

/* Red sa kalendarom mora da drži padajuće panele ispod sebe. */
.app-kalendar-red > div { position: relative; }

/* ---------- OBAVEŠTENJA ---------- */

.obavestenja {
  position: fixed;
  top: 0;
  left: 50%;
  z-index: 9998;
  width: 33.333vw;
  min-width: 300px;
  max-width: 480px;
  margin-left: -16.666vw;
  padding: 10px 10px 10px 20px;
  font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #fff;
  pointer-events: none;
}
@media (max-width: 768px) {
  .obavestenja { width: 100vw; margin-left: -50vw; min-width: 0; }
}
.obavestenje {
  position: relative;
  display: block;
  width: 100%;
  margin: 10px 0 0;
  padding: 10px 40px 10px 15px;
  border-radius: 4px;
  box-sizing: border-box;
  opacity: 0;
  cursor: pointer;
  pointer-events: auto;
  transition: all 0.5s ease-in-out;
}
.obavestenje.vidljivo { opacity: 1; }
.obavestenje.success { background-color: #a1e82c; }
.obavestenje.error { background-color: #fc727a; }
.obavestenje.warning { background-color: #ffbc67; }
.obavestenje.info { background-color: #63d8f1; }
.obavestenje .zatvori {
  position: absolute;
  right: 10px;
  top: 50%;
  width: 25px;
  height: 25px;
  margin-top: -13px;
  padding: 6px 3px 3px;
  color: #000;
  font-size: 21px;
  font-weight: 300;
  line-height: 11px;
  text-align: center;
  background-color: #fff;
  border: 0;
  border-radius: 50%;
  opacity: 0.4;
  cursor: pointer;
}

/* ---------- PORUKE NA STRANI ZA PRIJAVU ---------- */

.app-prijava-greska,
.app-prijava-poruka {
  margin: 0 0 14px;
  padding: 9px 12px;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;
}
.app-prijava-greska { background: #fdecec; color: #9e2a2a; border: 1px solid #f3c9c9; }
.app-prijava-poruka { background: #eef8e9; color: #2f6b26; border: 1px solid #cbe6bf; }

/* ---------- PREUZIMANJE: zatvorena poglavlja ---------- */

/* Stari portal je telo poglavlja crtao tek kad se otvori; ovde je uvek
   ispisano, pa se zatvoreno sklanja stilom. */
.poglavlje:not(.otvoreno) .poglavlje-telo { display: none; }

/* ---------- SITNICE ---------- */

/* Dugmad u traci i spisku ne smeju da nose podrazumevani izgled dugmeta. */
.app-traka-nav a { text-decoration: none; }

/* Poruka sa vage (messageBox) — isti razmak kao pasusi u karticama. */
.app-poruka-vage p { margin: 0 0 6px; }
.app-poruka-vage p:last-child { margin-bottom: 0; }