/* ==========================================================
   InventyHub v6.6.14 — Penilaian Aplikasi
   ========================================================== */

.app-rating-intro{
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  gap:16px;
  align-items:center;
}

.app-rating-intro-icon{
  width:64px;
  height:64px;
  display:grid;
  place-content:center;
  border-radius:19px;
  background:linear-gradient(145deg,#8f1722,#cb2c38);
  color:#fff;
  font-size:29px;
  box-shadow:0 12px 28px rgba(143,23,34,.19);
}

.app-rating-intro h2{
  margin:4px 0 6px;
  font-size:24px;
}

.app-rating-intro p{
  margin:0;
  color:var(--ink-500);
  line-height:1.6;
}

.app-rating-reference{
  margin-top:10px;
  padding:8px 10px;
  display:inline-grid;
  gap:2px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#faf7f6;
}

.app-rating-reference span{
  color:var(--ink-400);
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.app-rating-scale-explanation{
  margin:16px 0;
  padding:14px;
  border:1px solid #e3d4d1;
  border-radius:14px;
  background:#fbf7f5;
}

.app-rating-scale-explanation>p{
  margin:3px 0 11px;
  color:var(--ink-500);
  font-size:9px;
}

.app-rating-legend{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:6px;
}

.app-rating-legend>div{
  min-height:54px;
  padding:7px 5px;
  display:grid;
  justify-items:center;
  align-content:center;
  gap:3px;
  border:1px solid #e3d9d6;
  border-radius:10px;
  background:#fff;
  text-align:center;
}

.app-rating-legend b{
  width:24px;
  height:24px;
  display:grid;
  place-content:center;
  border-radius:50%;
  color:#fff;
  background:var(--brand-700);
  font-size:10px;
}

.app-rating-legend span{
  color:var(--ink-600);
  font-size:7.5px;
  font-weight:800;
}

.app-rating-question{
  padding:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  transition:.15s ease;
}

.app-rating-question.rating-missing{
  border-color:#d33844;
  box-shadow:0 0 0 3px rgba(211,56,68,.08);
}

.app-rating-question-head{
  margin-bottom:10px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.app-rating-question-head b{
  font-size:11px;
}

.app-rating-question-head p{
  margin:3px 0 0;
  color:var(--ink-500);
  font-size:8.5px;
  line-height:1.5;
}

.app-rating-options{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:6px;
}

.app-rating-option{
  cursor:pointer;
}

.app-rating-option input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.app-rating-option-card{
  min-height:62px;
  padding:7px 5px;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:3px;
  border:1px solid #ded6d4;
  border-radius:11px;
  background:#faf8f7;
  text-align:center;
  transition:.15s ease;
}

.app-rating-option-card strong{
  color:var(--brand-700);
  font-size:16px;
}

.app-rating-option-card small{
  color:var(--ink-500);
  font-size:7.5px;
  font-weight:800;
  line-height:1.3;
}

.app-rating-option:hover .app-rating-option-card{
  border-color:#c99da2;
  background:#fff5f6;
}

.app-rating-option input:checked + .app-rating-option-card{
  border-color:var(--brand-700);
  background:#fff0f1;
  box-shadow:0 0 0 2px rgba(143,23,34,.08);
}

.app-rating-option input:checked + .app-rating-option-card strong,
.app-rating-option input:checked + .app-rating-option-card small{
  color:var(--brand-700);
}

.app-rating-star{
  font-size:22px!important;
}

.app-rating-comment span{
  color:var(--ink-400);
  font-weight:400;
}

.app-rating-consent-note{
  padding:10px 12px;
  border:1px solid #d3e1d7;
  border-radius:11px;
  background:#f4faf6;
  color:#486052;
  font-size:8.5px;
  line-height:1.5;
}

.return-rating-invite{
  margin-top:10px;
  padding:11px;
  border:1px solid #ead4d1;
  border-radius:11px;
  background:#fff7f6;
}

.return-rating-invite p{
  margin:2px 0 0!important;
  font-size:8.5px!important;
}

.rating-thank-you{
  padding:12px;
  display:grid;
  justify-items:center;
  text-align:center;
}

.rating-thank-you-icon{
  width:62px;
  height:62px;
  margin-bottom:10px;
  display:grid;
  place-content:center;
  border-radius:50%;
  color:#fff;
  background:#26734d;
  font-size:28px;
}

.rating-thank-you h2{
  margin:5px 0;
}

.rating-thank-you p{
  max-width:520px;
  color:var(--ink-500);
  line-height:1.6;
}

.rating-thank-you-score{
  margin-top:10px;
  padding:10px 14px;
  display:grid;
  gap:2px;
  border:1px solid #d5e1d9;
  border-radius:11px;
  background:#f4faf6;
}

.rating-thank-you-score span{
  color:#567060;
  font-size:8px;
  text-transform:uppercase;
  font-weight:800;
}

/* Admin report */
.rating-report-hero{
  margin-bottom:16px;
  padding:22px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border:1px solid var(--line);
  border-radius:21px;
  background:
    radial-gradient(circle at 88% 12%,rgba(151,30,41,.08),transparent 15rem),
    linear-gradient(135deg,#fff,#fbf7f5);
}

.rating-report-hero h3{
  margin:4px 0 6px;
  font-size:clamp(23px,3vw,31px);
}

.rating-report-hero p{
  margin:0;
  max-width:780px;
  color:var(--ink-500);
  line-height:1.6;
}

.rating-success-index{
  min-width:135px;
  padding:13px 16px;
  display:grid;
  justify-items:center;
  gap:2px;
  border:1px solid #e3cfcc;
  border-radius:15px;
  background:#fff;
}

.rating-success-index strong{
  color:var(--brand-700);
  font-size:28px;
  line-height:1;
}

.rating-success-index span{
  color:var(--ink-400);
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
}

.rating-success-index b{
  margin-top:3px;
  color:#6d383d;
  font-size:9px;
}

.report-rating-stars{
  color:#b98b13;
  letter-spacing:1px;
  white-space:nowrap;
}

.rating-indicator-list,
.rating-distribution-list{
  display:grid;
  gap:10px;
}

.rating-indicator-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 48px;
  gap:6px 10px;
  align-items:center;
}

.rating-indicator-row>div:first-child{
  display:grid;
  gap:2px;
}

.rating-indicator-row>div:first-child>b{
  font-size:9px;
}

.rating-indicator-row>strong{
  text-align:right;
  color:var(--brand-700);
  font-size:12px;
}

.rating-indicator-track{
  grid-column:1/-1;
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:#ece5e3;
}

.rating-indicator-track i{
  height:100%;
  display:block;
  border-radius:999px;
  background:linear-gradient(90deg,#8f1722,#c92e3a);
}

.rating-distribution-row{
  display:grid;
  grid-template-columns:145px minmax(0,1fr) 32px;
  gap:8px;
  align-items:center;
}

.rating-distribution-row>span{
  font-size:8.5px;
}

.rating-distribution-row>span>b{
  color:var(--brand-700);
}

.rating-distribution-row>div{
  height:9px;
  overflow:hidden;
  border-radius:999px;
  background:#ece5e3;
}

.rating-distribution-row i{
  height:100%;
  display:block;
  border-radius:999px;
  background:#aa2430;
}

.rating-distribution-row>strong{
  text-align:right;
  font-size:9px;
}

.rating-feedback-list{
  display:grid;
  gap:9px;
}

.rating-feedback-card{
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
}

.rating-feedback-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.rating-feedback-head>div:first-child{
  display:grid;
  gap:2px;
}

.rating-feedback-head span{
  color:var(--ink-400);
  font-size:8px;
}

.rating-feedback-score{
  display:grid;
  justify-items:end;
  gap:2px;
  font-size:8px;
}

.rating-feedback-card blockquote{
  margin:10px 0 6px;
  padding:10px 12px;
  border-left:3px solid #b02b36;
  border-radius:0 8px 8px 0;
  background:#faf6f5;
  color:var(--ink-600);
  font-size:9px;
  line-height:1.55;
}

.rating-feedback-card>small{
  color:var(--ink-400);
  font-size:7.5px;
}

@media(max-width:760px){
  .app-rating-intro{
    grid-template-columns:1fr;
    justify-items:start;
  }

  .app-rating-legend,
  .app-rating-options{
    grid-template-columns:1fr;
  }

  .app-rating-legend>div,
  .app-rating-option-card{
    min-height:44px;
    grid-template-columns:28px 1fr;
    justify-items:start;
    align-items:center;
    text-align:left;
  }

  .app-rating-option-card strong{
    text-align:center;
  }

  .rating-report-hero{
    align-items:flex-start;
    flex-direction:column;
  }

  .rating-success-index{
    width:100%;
    grid-template-columns:auto auto auto;
    align-items:center;
  }

  .rating-feedback-head{
    flex-direction:column;
  }

  .rating-feedback-score{
    justify-items:start;
  }

  .rating-distribution-row{
    grid-template-columns:120px minmax(0,1fr) 28px;
  }
}