/* Extracted from item_details.html inline <style> blocks */

/* Block 1: Completeness status styles (line 757-879) */
#pi-completeness-status {
  margin-top: 12px;
}
#pi-completeness-status .pi-label {
  font-size: .9rem;
  letter-spacing: .03em;
  margin-bottom: 6px;
}
#pi-completeness-status .pi-value {
  line-height: 1.45;
  font-size: .92rem;
}
.completeness-card {
  border: 1px solid var(--ke-border);
  border-radius: 10px;
  padding: .75rem;
  background: var(--ke-surface);
  display: grid;
  gap: .6rem;
}
.completeness-card--red { border-color: var(--ke-danger); }
.completeness-card--yellow { border-color: var(--ke-warning); }
.completeness-card--green { border-color: var(--ke-success); }
.completeness-card--public.completeness-card--red { border-color: var(--ke-danger); }
.completeness-card--public.completeness-card--yellow { border-color: var(--ke-warning); }
.completeness-card--public.completeness-card--green { border-color: var(--ke-success); }
.completeness-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
}
.completeness-score {
  font-size: 1.35rem;
  color: var(--ke-text);
}
.completeness-pill {
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .18rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--ke-border);
}
.completeness-pill--red { background: rgba(220,38,38,.15); color: var(--ke-danger); border-color: rgba(220,38,38,.3); }
.completeness-pill--yellow { background: rgba(245,158,11,.15); color: var(--ke-warning); border-color: rgba(245,158,11,.3); }
.completeness-pill--green { background: rgba(34,197,94,.15); color: var(--ke-success); border-color: rgba(34,197,94,.3); }
.completeness-card--public .completeness-pill--red { background: rgba(220,38,38,.15); color: var(--ke-danger); border-color: rgba(220,38,38,.3); }
.completeness-card--public .completeness-pill--yellow { background: rgba(245,158,11,.15); color: var(--ke-warning); border-color: rgba(245,158,11,.3); }
.completeness-card--public .completeness-pill--green { background: rgba(34,197,94,.15); color: var(--ke-success); border-color: rgba(34,197,94,.3); }
.completeness-progress {
  height: 8px;
  border-radius: 999px;
  background: var(--ke-surface-2);
  border: 1px solid var(--ke-border);
  overflow: hidden;
}
.completeness-progress > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--ke-danger), var(--ke-warning), var(--ke-success));
  border-radius: inherit;
}
.completeness-card--public .completeness-progress > span {
  background: linear-gradient(90deg, var(--ke-warning), var(--ke-success), var(--ke-primary));
}
.completeness-meta {
  color: var(--ke-text-muted);
  font-size: .95rem;
}
.completeness-section-title {
  font-size: .84rem;
  color: var(--ke-danger);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.completeness-card--public .completeness-section-title {
  color: var(--ke-warning);
  text-transform: none;
}
.completeness-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.completeness-chip {
  font-size: .86rem;
  padding: .16rem .5rem;
  border-radius: 999px;
  background: var(--ke-surface);
  border: 1px solid var(--ke-border);
  color: var(--ke-text);
}
.completeness-chip--critical {
  background: var(--ke-surface);
  border-color: var(--ke-danger);
  color: var(--ke-danger);
}
.completeness-card--public .completeness-chip--critical {
  border-color: var(--ke-warning);
  color: var(--ke-warning);
}
.completeness-head,
.completeness-meta,
.completeness-section-title,
.completeness-chip-list,
.completeness-details,
.completeness-details summary {
  background: var(--ke-surface);
}
.completeness-details summary {
  cursor: pointer;
  color: var(--ke-text-muted);
  font-size: .92rem;
  font-weight: 600;
}
.completeness-details[open] .completeness-chip-list {
  margin-top: .5rem;
}

/* Block 2: Unit settings modal styles (line 3039-3133) */
.conversion-rule-inputs {
  display: grid;
  grid-template-columns: 80px 1fr auto 1fr 1fr;
  gap: 10px;
  align-items: start;
}

@media (max-width: 768px) {
  .unit-settings-modal-content {
    margin: 2% 5% !important;
    padding: 20px !important;
    max-width: 95% !important;
  }

  .conversion-rule-inputs {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .rule-equals {
    padding-top: 0 !important;
    margin: 5px 0;
  }

  .base-unit-controls {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .base-unit-controls button {
    width: 100% !important;
  }

  .completeness-checklist {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .completeness-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    padding: 0.4rem 0.6rem;
    border-radius: 4px;
    background: var(--ke-surface);
    border-left: 3px solid var(--ke-border);
  }

  .completeness-item.complete {
    border-left-color: var(--ke-success);
    color: var(--ke-success);
  }

  .completeness-item.missing {
    border-left-color: var(--ke-warning);
    color: var(--ke-warning);
  }

  .completeness-item.critical-missing {
    border-left-color: var(--ke-danger);
    color: var(--ke-danger);
  }

  .completeness-status-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 0.8rem;
  }

  .completeness-status-badge.red {
    background: rgba(220,38,38,.15);
    color: var(--ke-danger);
    border: 1px solid rgba(220,38,38,.3);
  }

  .completeness-status-badge.yellow {
    background: rgba(245,158,11,.15);
    color: var(--ke-warning);
    border: 1px solid rgba(245,158,11,.3);
  }

  .completeness-status-badge.green {
    background: rgba(34,197,94,.15);
    color: var(--ke-success);
    border: 1px solid rgba(34,197,94,.3);
  }
}

/* Block 3: Similar items carousel styles (line 3845-3864) */
.int-similar-section{max-width:980px;margin:28px auto 16px;padding:0 12px;}
.int-similar-section h2{margin:0 0 8px;color:var(--ke-warning);font-size:1.15rem;text-align:center;}
.int-similar-carousel{--per-page:3;display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:10px;align-items:center;}
.int-similar-viewport{overflow:hidden;}
.int-similar-track{display:flex;transition:transform 320ms ease;will-change:transform;}
.int-similar-slide{flex:0 0 calc(100%/var(--per-page));padding:0 7px;box-sizing:border-box;}
.int-similar-card{background:var(--ke-surface);border:1px solid var(--ke-border);border-radius:14px;overflow:hidden;box-shadow:0 8px 22px rgba(0,0,0,.28);min-height:100%;}
.int-similar-image{display:flex;align-items:flex-start;justify-content:flex-start;height:150px;padding:10px;text-decoration:none;}
.int-similar-badge-new{display:inline-block;background:rgba(0,100,60,.88);color:#7fffc4;border:1px solid #7fffc4;border-radius:999px;padding:4px 10px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap;}
.int-similar-body{padding:11px 12px 12px;display:flex;flex-direction:column;gap:6px;}
.int-similar-body h3{margin:0;font-size:17px;color:var(--ke-text);}
.int-similar-cat{color:var(--ke-text-muted);font-size:13px;text-transform:uppercase;letter-spacing:.04em;}
.int-similar-body p{margin:0;font-size:14px;line-height:1.42;color:var(--ke-text-muted);}
.int-similar-link{color:var(--ke-primary);text-decoration:underline;font-size:14px;}
.int-similar-nav{height:42px;width:42px;border-radius:999px;border:1px solid var(--ke-border);background:var(--ke-surface);color:var(--ke-warning);cursor:pointer;}
.int-similar-nav:hover{filter:brightness(1.08);}
@media(max-width:860px){.int-similar-carousel{--per-page:2;}}
@media(max-width:640px){.int-similar-carousel{--per-page:1;grid-template-columns:36px minmax(0,1fr) 36px;gap:6px;}.int-similar-nav{width:36px;height:36px;}}

/* Light mode overrides for similar items */
[data-theme="light"] .int-similar-section h2 { color: var(--ke-text) !important; }
[data-theme="light"] .int-similar-card { background: var(--ke-surface) !important; border-color: var(--ke-border) !important; box-shadow: 0 2px 8px rgba(0,0,0,.08) !important; }
[data-theme="light"] .int-similar-badge-new { background: rgba(22,163,74,.2) !important; color: #15803d !important; border-color: rgba(22,163,74,.5) !important; font-weight: 800 !important; }
[data-theme="light"] .int-similar-body h3 { color: var(--ke-text) !important; }
[data-theme="light"] .int-similar-cat { color: var(--ke-text-muted) !important; }
[data-theme="light"] .int-similar-body p { color: var(--ke-text-muted) !important; }
[data-theme="light"] .int-similar-link { color: var(--ke-primary) !important; }
[data-theme="light"] .int-similar-nav { background: var(--ke-surface) !important; border-color: var(--ke-border) !important; color: var(--ke-warning) !important; }

/* Light mode overrides for completeness card */
[data-theme="light"] .completeness-card { background: var(--ke-surface) !important; border-color: var(--ke-border) !important; }
[data-theme="light"] .completeness-card--red { border-color: var(--ke-danger) !important; }
[data-theme="light"] .completeness-card--yellow { border-color: var(--ke-warning) !important; }
[data-theme="light"] .completeness-card--green { border-color: var(--ke-success) !important; }
[data-theme="light"] .completeness-score { color: var(--ke-text) !important; }
[data-theme="light"] .completeness-pill--red { background: rgba(220,38,38,.1) !important; color: var(--ke-danger) !important; border-color: rgba(220,38,38,.3) !important; }
[data-theme="light"] .completeness-pill--yellow { background: rgba(245,158,11,.1) !important; color: var(--ke-warning) !important; border-color: rgba(245,158,11,.3) !important; }
[data-theme="light"] .completeness-pill--green { background: rgba(34,197,94,.1) !important; color: var(--ke-success) !important; border-color: rgba(34,197,94,.3) !important; }
[data-theme="light"] .completeness-progress { background: var(--ke-surface-2) !important; }
[data-theme="light"] .completeness-meta { color: var(--ke-text-muted) !important; }
[data-theme="light"] .completeness-section-title { color: var(--ke-text) !important; }
[data-theme="light"] .completeness-chip { background: var(--ke-surface-2) !important; color: var(--ke-text) !important; border-color: var(--ke-border) !important; }
[data-theme="light"] .completeness-chip--critical { background: rgba(220,38,38,.08) !important; color: var(--ke-danger) !important; border-color: rgba(220,38,38,.3) !important; }
[data-theme="light"] .completeness-details summary { color: var(--ke-text-muted) !important; }
[data-theme="light"] .completeness-item { color: var(--ke-text) !important; border-color: var(--ke-border) !important; }
[data-theme="light"] .completeness-item.complete { color: var(--ke-success) !important; }
[data-theme="light"] .completeness-item.missing { color: var(--ke-warning) !important; }
[data-theme="light"] .completeness-item.critical-missing { color: var(--ke-danger) !important; }
[data-theme="light"] .completeness-status-badge { border-color: var(--ke-border) !important; color: var(--ke-text-muted) !important; }
[data-theme="light"] .completeness-status-badge.red { background: rgba(220,38,38,.1) !important; color: var(--ke-danger) !important; }
[data-theme="light"] .completeness-status-badge.yellow { background: rgba(245,158,11,.1) !important; color: var(--ke-warning) !important; }
[data-theme="light"] .completeness-status-badge.green { background: rgba(34,197,94,.1) !important; color: var(--ke-success) !important; }
