/*
 * JUSTCAR 4.7.7 — prémiové hodnocení vozu
 * Společný vzhled pro exteriér, interiér, technický stav a celkové hodnocení.
 */

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 18px 22px !important;
  width: min(100% - 48px, 1420px) !important;
  max-width: 1420px !important;
  margin: 28px auto !important;
  padding: 22px 26px !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(46, 115, 165, .18), transparent 34%),
    linear-gradient(135deg, rgba(59, 60, 75, .98), rgba(43, 43, 55, .98)) !important;
  border: 1px solid rgba(230, 232, 242, .9) !important;
  border-radius: 22px !important;
  box-shadow:
    0 18px 42px rgba(0, 0, 0, .34),
    inset 0 1px 0 rgba(255, 255, 255, .06) !important;
  box-sizing: border-box !important;
}

/* Celkové hodnocení — verdikt technika */
body:is(.jc, .jc-view) .hodnoceni-vozu::after {
  content: none !important;
  display: none !important;
}

body:is(.jc, .jc-view) .overall-verdict-card {
  grid-column: 1 / -1 !important;
  display: grid !important;
  gap: 18px !important;
  margin-top: 4px !important;
  padding: 24px !important;
  border: 1px solid rgba(188, 197, 55, .34) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(188, 197, 55, .14), transparent 34%),
    linear-gradient(135deg, rgba(30, 41, 59, .82), rgba(24, 24, 32, .92)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 16px 36px rgba(0, 0, 0, .24) !important;
}

body:is(.jc, .jc-view) .overall-verdict-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

body:is(.jc, .jc-view) .overall-verdict-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(188, 197, 55, .44) !important;
  border-radius: 999px !important;
  color: #101827 !important;
  background: linear-gradient(135deg, #c8ff1a, #a6b431) !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  box-shadow: 0 10px 24px rgba(188, 197, 55, .16) !important;
}

body:is(.jc, .jc-view) .overall-verdict-badge > span {
  opacity: .78 !important;
  text-transform: uppercase !important;
}

body:is(.jc, .jc-view) .overall-verdict-badge select {
  appearance: none !important;
  border: 0 !important;
  color: #101827 !important;
  background: transparent !important;
  font: inherit !important;
  font-weight: 950 !important;
  outline: none !important;
  cursor: pointer !important;
  min-height: 0 !important;
  padding: 0 !important;
}

body:is(.jc, .jc-view) .overall-verdict-field {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body:is(.jc, .jc-view) .overall-verdict-field > span {
  color: #bfdbfe !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

body:is(.jc, .jc-view) .overall-verdict-text > span {
  color: #fff !important;
  font-size: clamp(22px, 1.8vw, 30px) !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
}

body:is(.jc, .jc-view) .overall-verdict-card textarea[name="overall_verdict_text"] {
  min-height: 128px !important;
  font-size: clamp(17px, 1.3vw, 21px) !important;
  font-weight: 650 !important;
  line-height: 1.55 !important;
}

body:is(.jc, .jc-view) .overall-verdict-grid {
  display: grid !important;
  grid-template-columns: 1.25fr 1fr .8fr !important;
  gap: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(219, 234, 254, .18) !important;
}

body:is(.jc, .jc-view) .overall-verdict-card input,
body:is(.jc, .jc-view) .overall-verdict-card select {
  width: 100% !important;
  min-height: 52px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(183, 190, 207, .46) !important;
  border-radius: 14px !important;
  color: #fff !important;
  background: rgba(25, 25, 33, .94) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  outline: none !important;
  box-sizing: border-box !important;
}

body:is(.jc, .jc-view) .overall-verdict-card input::placeholder,
body:is(.jc, .jc-view) .overall-verdict-card textarea::placeholder {
  color: rgba(205, 214, 229, .58) !important;
}

body:is(.jc, .jc-view) .overall-verdict-card input:focus,
body:is(.jc, .jc-view) .overall-verdict-card textarea:focus,
body:is(.jc, .jc-view) .overall-verdict-card select:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, .16) !important;
}

@media (max-width: 820px) {
  body:is(.jc, .jc-view) .overall-verdict-card {
    padding: 16px !important;
    border-radius: 18px !important;
  }

  body:is(.jc, .jc-view) .overall-verdict-top {
    align-items: stretch !important;
  }

  body:is(.jc, .jc-view) .overall-verdict-badge {
    width: 100% !important;
    justify-content: space-between !important;
  }

  body:is(.jc, .jc-view) .overall-verdict-card textarea[name="overall_verdict_text"] {
    min-height: 140px !important;
    font-size: 16px !important;
  }

  body:is(.jc, .jc-view) .overall-verdict-grid {
    grid-template-columns: 1fr !important;
  }
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) > h2 {
  grid-column: 1 !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(24px, 2vw, 32px) !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  letter-spacing: .01em !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) > h2::before {
  content: "★";
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-right: 10px;
  border: 1px solid rgba(188, 197, 55, .52);
  border-radius: 10px;
  color: #fbbf24;
  background: rgba(17, 24, 39, .46);
  font-size: 18px;
  vertical-align: middle;
  box-shadow: 0 0 0 3px rgba(251, 191, 36, .06);
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) > div:has(.star-rating) {
  grid-column: 2 !important;
  justify-self: end !important;
  display: grid !important;
  grid-template-columns: auto auto !important;
  grid-template-areas:
    "label value"
    "stars stars" !important;
  align-items: center !important;
  gap: 6px 10px !important;
  min-width: min(100%, 360px) !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(88, 166, 255, .34) !important;
  border-radius: 16px !important;
  background: rgba(24, 35, 52, .58) !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) > div:has(.star-rating) > span:first-child {
  grid-area: label !important;
  color: #dbeafe !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) .rating-value {
  grid-area: value !important;
  justify-self: end !important;
  min-width: 58px !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  border: 1px solid rgba(251, 191, 36, .34) !important;
  border-radius: 999px !important;
  color: #fbbf24 !important;
  background: rgba(64, 48, 20, .58) !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  text-align: center !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) .star-rating {
  grid-area: stars !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  color: #fbbf24 !important;
  font-size: 28px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) .star-rating .star {
  display: inline-grid !important;
  place-items: center !important;
  width: 26px !important;
  height: 30px !important;
  color: #dbeafe !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .28) !important;
  transition:
    color .16s ease,
    transform .16s ease,
    text-shadow .16s ease !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) .star-rating .star:hover {
  color: #fbbf24 !important;
  transform: translateY(-1px) scale(1.08) !important;
  text-shadow: 0 0 14px rgba(251, 191, 36, .48) !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) textarea {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-height: 108px !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  border: 1px solid rgba(183, 190, 207, .46) !important;
  border-radius: 14px !important;
  color: #fff !important;
  background: rgba(25, 25, 33, .94) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  resize: vertical !important;
  outline: none !important;
  box-sizing: border-box !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) textarea::placeholder {
  color: rgba(205, 214, 229, .62) !important;
  font-weight: 800 !important;
}

body:is(.jc, .jc-view) :is(
  .hodnoceni-exterieru-vozu-section,
  .hodnoceni-interieru-vozu-section,
  .hodnoceni-technickeho-stavu-vozu-section,
  .hodnoceni-vozu
) textarea:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, .16) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu::after {
  content: "Finální verdikt protokolu";
  grid-column: 1 / -1;
  display: inline-flex;
  width: fit-content;
  padding: 9px 13px;
  border: 1px solid rgba(188, 197, 55, .36);
  border-radius: 999px;
  color: #dbeafe;
  background: rgba(17, 24, 39, .42);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (max-width: 820px) {
  body:is(.jc, .jc-view) :is(
    .hodnoceni-exterieru-vozu-section,
    .hodnoceni-interieru-vozu-section,
    .hodnoceni-technickeho-stavu-vozu-section,
    .hodnoceni-vozu
  ) {
    grid-template-columns: 1fr !important;
    width: calc(100% - 18px) !important;
    margin: 18px auto !important;
    padding: 16px !important;
    gap: 14px !important;
    border-radius: 18px !important;
  }

  body:is(.jc, .jc-view) :is(
    .hodnoceni-exterieru-vozu-section,
    .hodnoceni-interieru-vozu-section,
    .hodnoceni-technickeho-stavu-vozu-section,
    .hodnoceni-vozu
  ) > div:has(.star-rating) {
    grid-column: 1 !important;
    justify-self: stretch !important;
    min-width: 0 !important;
  }

  body:is(.jc, .jc-view) :is(
    .hodnoceni-exterieru-vozu-section,
    .hodnoceni-interieru-vozu-section,
    .hodnoceni-technickeho-stavu-vozu-section,
    .hodnoceni-vozu
  ) .star-rating {
    justify-content: flex-start !important;
    font-size: 25px !important;
  }

  body:is(.jc, .jc-view) :is(
    .hodnoceni-exterieru-vozu-section,
    .hodnoceni-interieru-vozu-section,
    .hodnoceni-technickeho-stavu-vozu-section,
    .hodnoceni-vozu
  ) textarea {
    min-height: 96px !important;
    padding: 14px !important;
    font-size: 16px !important;
  }
}

/* Celkové hodnocení — finální override musí být za starými styly */
body:is(.jc, .jc-view) .hodnoceni-vozu::after {
  content: none !important;
  display: none !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card {
  grid-column: 1 / -1 !important;
  display: grid !important;
  gap: 18px !important;
  margin-top: 4px !important;
  padding: 24px !important;
  border: 1px solid rgba(188, 197, 55, .34) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(188, 197, 55, .14), transparent 34%),
    linear-gradient(135deg, rgba(30, 41, 59, .82), rgba(24, 24, 32, .92)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 16px 36px rgba(0, 0, 0, .24) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(188, 197, 55, .44) !important;
  border-radius: 999px !important;
  color: #101827 !important;
  background: linear-gradient(135deg, #c8ff1a, #a6b431) !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  box-shadow: 0 10px 24px rgba(188, 197, 55, .16) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-badge > span {
  opacity: .78 !important;
  text-transform: uppercase !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-badge select {
  appearance: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #101827 !important;
  background: transparent !important;
  font: inherit !important;
  font-weight: 950 !important;
  outline: none !important;
  cursor: pointer !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-field {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-field > span {
  color: #bfdbfe !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-text > span {
  color: #fff !important;
  font-size: clamp(22px, 1.8vw, 30px) !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card textarea[name="overall_verdict_text"] {
  min-height: 128px !important;
  padding: 16px 18px !important;
  border: 1px solid rgba(183, 190, 207, .46) !important;
  border-radius: 14px !important;
  color: #fff !important;
  background: rgba(25, 25, 33, .94) !important;
  font-size: clamp(17px, 1.3vw, 21px) !important;
  font-weight: 650 !important;
  line-height: 1.55 !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-grid {
  display: grid !important;
  grid-template-columns: 1.25fr 1fr .8fr !important;
  gap: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(219, 234, 254, .18) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card input {
  width: 100% !important;
  min-height: 52px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(183, 190, 207, .46) !important;
  border-radius: 14px !important;
  color: #fff !important;
  background: rgba(25, 25, 33, .94) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  outline: none !important;
  box-sizing: border-box !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card input::placeholder,
body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card textarea::placeholder {
  color: rgba(205, 214, 229, .58) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card input:focus,
body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card textarea:focus,
body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card select:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, .16) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-recommended {
  border-color: rgba(34, 197, 94, .44) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(34, 197, 94, .18), transparent 34%),
    linear-gradient(135deg, rgba(30, 54, 49, .88), rgba(24, 24, 32, .92)) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-attention {
  border-color: rgba(245, 158, 11, .48) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(245, 158, 11, .18), transparent 34%),
    linear-gradient(135deg, rgba(62, 48, 34, .88), rgba(24, 24, 32, .92)) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-not-recommended {
  border-color: rgba(248, 81, 73, .50) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(248, 81, 73, .20), transparent 34%),
    linear-gradient(135deg, rgba(64, 34, 42, .9), rgba(24, 24, 32, .92)) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-recommended .overall-verdict-badge {
  border-color: rgba(34, 197, 94, .58) !important;
  color: #052e16 !important;
  background: linear-gradient(135deg, #b7ff2a, #22c55e) !important;
  box-shadow: 0 10px 26px rgba(34, 197, 94, .20) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-attention .overall-verdict-badge {
  border-color: rgba(245, 158, 11, .62) !important;
  color: #431407 !important;
  background: linear-gradient(135deg, #ffd166, #f59e0b) !important;
  box-shadow: 0 10px 26px rgba(245, 158, 11, .20) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-not-recommended .overall-verdict-badge {
  border-color: rgba(248, 81, 73, .65) !important;
  color: #fff !important;
  background: linear-gradient(135deg, #ff6b6b, #dc2626) !important;
  box-shadow: 0 10px 26px rgba(248, 81, 73, .22) !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-recommended .overall-verdict-badge select,
body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-attention .overall-verdict-badge select {
  color: #101827 !important;
}

body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-not-recommended .overall-verdict-badge select {
  color: #fff !important;
}

@media (max-width: 820px) {
  body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card {
    padding: 16px !important;
    border-radius: 18px !important;
  }

  body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-top {
    align-items: stretch !important;
  }

  body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-badge {
    width: 100% !important;
    justify-content: space-between !important;
  }

  body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-card textarea[name="overall_verdict_text"] {
    min-height: 140px !important;
    font-size: 16px !important;
  }

  body:is(.jc, .jc-view) .hodnoceni-vozu .overall-verdict-grid {
    grid-template-columns: 1fr !important;
  }
}

/* An unfilled verdict is neutral in the editor and in the customer report. */
body:is(.jc,.jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-not-evaluated{border-color:#64748b!important;background:linear-gradient(135deg,#263244,#181820)!important}
body:is(.jc,.jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-not-evaluated .overall-verdict-badge{background:#334155!important;border-color:#94a3b8!important;color:#fff!important;box-shadow:none!important}
body:is(.jc,.jc-view) .hodnoceni-vozu .overall-verdict-card.verdict-not-evaluated select{color:#fff!important}
