/* === NiezbednikWP — khaki theme override === */
:root{
  /* Główne kolory */
  --khaki: #6b6a57;                  /* Primary */
  --khaki-rgb: 107,106,87;
  --khaki-600: #5f5e4e;
  --khaki-500: #6b6a57;
  --khaki-400: #767564;
  --khaki-200: #d8d6c8;

  /* Podmiana Bootstrapowych zmiennych na khaki */
  --bs-primary: var(--khaki);
  --bs-link-color: var(--khaki);
  --bs-link-hover-color: #4f4e40;
  --bs-focus-ring-color: rgba(var(--khaki-rgb), .25);
}

/* Linki */
a { color: var(--bs-link-color); }
a:hover { color: var(--bs-link-hover-color); }

/* Przyciski */
.btn-primary{
  background-color: var(--khaki);
  border-color: var(--khaki);
}
.btn-primary:hover,
.btn-primary:focus{
  background-color: var(--khaki-600);
  border-color: var(--khaki-600);
}
.btn-outline-primary{
  color: var(--khaki);
  border-color: var(--khaki);
}
.btn-outline-primary:hover,
.btn-outline-primary:focus{
  color: #fff;
  background-color: var(--khaki);
  border-color: var(--khaki);
}

/* Pasek nawigacji (ciemny, ale khaki) */
.navbar-khaki{
  background-color: var(--khaki) !important;
}
.navbar-khaki .navbar-brand,
.navbar-khaki .nav-link{
  color: rgba(255,255,255,.9) !important;
}
.navbar-khaki .nav-link:hover,
.navbar-khaki .nav-link:focus{
  color: #fff !important;
}
.navbar-khaki .navbar-toggler{
  border-color: rgba(255,255,255,.35);
}

/* Timer w menu — jasna pigułka + progi ostrzegawcze */
.timer-pill{
  display:inline-block; padding:.38rem .66rem; line-height:1;
  border-radius:.66rem; font-weight:600; font-variant-numeric:tabular-nums;
  background:#f7f7f2; color:#212529; border:1px solid #dfdfd6; box-shadow:0 1px 2px rgba(0,0,0,.08);
}
.timer-pill.warning{
  color: var(--bs-warning-text, #664d03);
  background: var(--bs-warning-bg-subtle, #fff3cd);
  border-color: var(--bs-warning-border-subtle, #ffe69c);
}
.timer-pill.danger{
  color: var(--bs-danger-text, #58151c);
  background: var(--bs-danger-bg-subtle, #f8d7da);
  border-color: var(--bs-danger-border-subtle, #f1aeb5);
}
.timer-pill.timer-muted{
  color:#6c757d; background:#f1f3f5; border-color:#e9ecef;
}

/* Postęp, badge, drobne akcenty */
.progress-bar{ background-color: var(--khaki); }
.badge-khaki{ background-color: var(--khaki); color:#fff; }
.bg-khaki-subtle{ background-color: rgba(var(--khaki-rgb), .06) !important; }
.border-khaki{ border-color: rgba(var(--khaki-rgb), .35) !important; }
.text-khaki{ color: var(--khaki) !important; }

/* Karty, sekcje */
.card{ border-color: rgba(0,0,0,.08); }
.card .card-header{ background: #faf9f4; }

/* Formularze — focus w kolorze khaki */
.form-control:focus, .form-select:focus{
  border-color: var(--khaki);
  box-shadow: 0 0 0 .2rem rgba(var(--khaki-rgb), .25);
}
.form-check-input{
  accent-color: var(--khaki);
}

/* Kafelkowe odpowiedzi (z Twojej wersji, pod khaki) */
.question-form .form-check{
  position: relative;
  padding: .75rem .75rem .75rem 2.75rem;
  background: #f8f9fa;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: .5rem;
  transition: background .2s, border-color .2s, box-shadow .2s;
  margin-bottom: .5rem;
}
.question-form .form-check:hover{
  background: #eef1f4;
  border-color: #c7cdd4;
}
.question-form .form-check-input{
  position: absolute; left: .9rem; top: 50%;
  transform: translateY(-50%); margin:0; width:1.05rem; height:1.05rem;
  accent-color: var(--khaki);
}
.question-form .form-check-label{ display:block; margin:0; cursor:pointer; }
.question-form .form-check:has(.form-check-input:focus-visible){
  outline: 3px solid rgba(var(--khaki-rgb), .25);
  outline-offset: 2px;
}
.question-form .form-check:has(.form-check-input:checked){
  border-color: var(--khaki);
  background: color-mix(in srgb, var(--khaki) 8%, #ffffff);
  box-shadow: 0 0 0 .12rem rgba(var(--khaki-rgb), .12);
}
@supports not (background: color-mix(in srgb, black 10%, white)){
  .question-form .form-check:has(.form-check-input:checked){ background:#eaeae0; }
}
.question-form .form-check:has(.form-check-input:checked) .form-check-label{ font-weight:600; }

/* Drobne: pagination, pills, dropdown akcentowane khaki */
.pagination .page-link{ color: var(--khaki); }
.pagination .page-link:focus{ box-shadow:0 0 0 .2rem rgba(var(--khaki-rgb), .25); }
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{ background-color: var(--khaki); }
.dropdown-item.active, .dropdown-item:active{ background-color: var(--khaki); }

/* ==== Badges (pytanie / kategoria / źródło) ==== */
.badge-question{
  background-color: var(--khaki);
  color:#fff;
}
.badge-category{
  background: rgba(var(--khaki-rgb), .08);
  color: var(--khaki);
  border: 1px solid rgba(var(--khaki-rgb), .28);
}
.badge-source{
  background: #f7f7f2;
  color: var(--khaki-600);
  border: 1px dashed rgba(var(--khaki-rgb), .35);
}

/* ==== Odpowiedzi (ciemniejsze tło + obramowanie, pod khaki) ==== */
.question-form .form-check{
  position: relative;
  padding: .75rem .75rem .75rem 2.75rem;
  background: rgba(var(--khaki-rgb), .06);            /* ciemniejsze subtelne tło */
  border: 1px solid rgba(var(--khaki-rgb), .25);      /* obramowanie pod khaki */
  border-radius: .5rem;
  transition: background .2s, border-color .2s, box-shadow .2s;
  margin-bottom: .5rem;
}
.question-form .form-check:hover{
  background: rgba(var(--khaki-rgb), .10);
  border-color: rgba(var(--khaki-rgb), .35);
}
.question-form .form-check-input{
  position: absolute; left: .9rem; top: 50%;
  transform: translateY(-50%); margin:0; width:1.05rem; height:1.05rem;
  accent-color: var(--khaki);
}
.question-form .form-check:has(.form-check-input:focus-visible){
  outline: 3px solid rgba(var(--khaki-rgb), .25);
  outline-offset: 2px;
}
.question-form .form-check:has(.form-check-input:checked){
  border-color: var(--khaki);
  background: color-mix(in srgb, var(--khaki) 12%, #ffffff); /* wyraźniejszy wybór */
  box-shadow: 0 0 0 .12rem rgba(var(--khaki-rgb), .12);
}
@supports not (background: color-mix(in srgb, black 10%, white)){
  .question-form .form-check:has(.form-check-input:checked){ background:#e0dfd6; }
}
.question-form .form-check:has(.form-check-input:checked) .form-check-label{
  font-weight: 600;
}

/* Kompaktowy, wyraźny przycisk do zgłoszeń */
.btn-report{
  --report-color: #7d4545;            /* delikatnie przygaszona czerwień */
  color: var(--report-color);
  border: 1px solid var(--report-color);
  background-color: transparent;
  padding: .25rem .5rem;              /* mniejszy niż standardowe btn-sm */
  font-size: .80rem;
  line-height: 1.2;
  border-radius: .30rem;
}

.btn-report:hover,
.btn-report:focus{
  color: #fff;
  background-color: var(--report-color);
  border-color: var(--report-color);
}

.btn-report:focus{
  box-shadow: 0 0 0 .2rem rgba(120,0,0,.15); /* subtelny outline pod kolor */
}

/* opcjonalnie: lekka ramka w stanie active */
.btn-report:active{
  filter: brightness(0.95);
}

/* --- Khaki form (ciemniejsze pola) --- */
.propose-card .form-control,
.propose-card .form-select {
  background-color: #f2f1ea;           /* lekko przyciemnione tło */
  border-color: #c6c3b5;               /* cieplejsza obwódka */
  color: #212529;
}

.propose-card .form-control::placeholder {
  color: #7a786d;                       /* delikatniejszy placeholder */
  opacity: 1;
}

.propose-card .input-group-text {
  background-color: #ecebe4;
  border-color: #c6c3b5;
  color: #4a4a3f;
}

.propose-card .form-check-input {
  border-color: #9b998b;
  background-color: #f2f1ea;
}
.propose-card .form-check-input:checked {
  background-color: #6b6a57;            /* khaki primary */
  border-color: #6b6a57;
}

.propose-card .form-control:focus,
.propose-card .form-select:focus {
  background-color: #eeede6;
  border-color: #8a8976;
  box-shadow: 0 0 0 .2rem rgba(107,106,87,.25);
}

.propose-card .form-text {
  color: #6d6c5f;
}

.propose-card .card-body {
  background: #faf9f5;                  /* subtelnie cieplejsze tło karty */
}

/* --- Alerty dopasowane do motywu (delikatniejsze) --- */
.alert-success-khaki {
  background: #eaf6ea;
  border: 1px solid #b8e0b8;
  color: #1f4e24;
}
.alert-danger-khaki {
  background: #fdeaea;
  border: 1px solid #e5bcbc;
  color: #6a1f1f;
}

/* --- Akordeon z kolorowymi nagłówkami --- */
.accordion-item.good .accordion-button {
  background: #eaf6ea;
  color: #1f4e24;
  border-left: 4px solid #2f7d32;
}
.accordion-item.bad .accordion-button {
  background: #fdeaea;
  color: #6a1f1f;
  border-left: 4px solid #b33636;
}
.accordion-button:focus {
  box-shadow: 0 0 0 .2rem rgba(107,106,87,.25);
}
.accordion-button:not(.collapsed) {
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.1);
}

.small {
	font-size:11px;
}

.nav-tabs.khaki-tabs {
  border-bottom: 1px solid var(--khaki, #6b6a57);
}

.nav-tabs.khaki-tabs .nav-link {
  border-color: rgba(107,106,87,0.25); /* delikatny hover */
  color: var(--khaki, #6b6a57);
  background-color: rgba(107,106,87,0.06);

}

.nav-tabs.khaki-tabs .nav-link:hover {
  border-color: rgba(107,106,87,0.55); /* delikatny hover */
  color: var(--khaki, #6b6a57);
  background-color: rgba(107,106,87,0.15);
}

.nav-tabs.khaki-tabs .nav-link.active {
  color: var(--khaki, #6b6a57);
  font-weight: 600;
  background-color: #fff;
  border-color: var(--khaki, #6b6a57) var(--khaki, #6b6a57) #fff; /* górne i boczne khaki, dół biały */
  border-width: 1px 1px 0 1px;
}

/* Równe wysokości kafelków w statystykach */
.stat-tiles .card { height: 100%; }

.pagination .page-link {
  color: var(--khaki);
  border-color: rgba(107,106,87,0.35);
}

.pagination .page-link:hover {
  color: var(--khaki);
  background-color: rgba(107,106,87,0.08);
  border-color: var(--khaki);
}

.pagination .page-item.active .page-link {
  color: #fff;
  background-color: var(--khaki);
  border-color: var(--khaki);
}

.pagination .page-link:focus {
  box-shadow: 0 0 0 .2rem rgba(107,106,87,.25);
}

/* === Buttons — spójne stany aktywne/focus w kolorze khaki === */

/* Uniwersalny ring dla wszystkich przycisków (zamiast domyślnego niebieskiego) */
.btn:focus,
.btn:active,
.btn:focus-visible {
  box-shadow: 0 0 0 .2rem rgba(var(--khaki-rgb), .25) !important;
}

/* PRIMARY — dopnij stan :active i .btn-check */
.btn-primary:active,
.btn-check:checked + .btn.btn-primary {
  background-color: var(--khaki-600);
  border-color: var(--khaki-600);
}

/* OUTLINE PRIMARY — także :active i .btn-check */
.btn-outline-primary:active,
.btn-check:checked + .btn-outline-primary {
  color: #fff;
  background-color: var(--khaki);
  border-color: var(--khaki);
}

/* SUCCESS / DANGER — ring też w khaki (opcjonalnie) */
.btn-success:focus,
.btn-success:active,
.btn-outline-success:focus,
.btn-outline-success:active,
.btn-danger:focus,
.btn-danger:active,
.btn-outline-danger:focus,
.btn-outline-danger:active {
  box-shadow: 0 0 0 .2rem rgba(var(--khaki-rgb), .25) !important;
}

/* === „Zgłoś uwagę” — wersja outline w czerwieni (spójna z exam.php) === */
.btn-outline-report {
  --report: #780000;
  color: var(--report);
  border: 1px solid var(--report);
  background: transparent;
}

.btn-outline-report:hover,
.btn-outline-report:active,
.btn-check:checked + .btn-outline-report {
  color: #fff;
  background-color: var(--report);
  border-color: var(--report);
}

.btn-outline-report:focus {
  box-shadow: 0 0 0 .2rem rgba(120,0,0,.25) !important;
}