/* CareCue add-on module — Prescription-image widget styles.
   Owner: Agent 3. Loaded via <link rel="stylesheet" href="modules/rximage.css">.
   Reuses core theme tokens with fallbacks so it also works on a scratch page. */

.cc-rx{
  background:var(--card,#1e293b);
  border:1px solid var(--line,#334155);
  border-radius:14px;
  padding:14px;
}
.cc-rx-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.cc-rx-title{font-size:15px;font-weight:700;color:var(--ink,#e8eefc)}
.cc-rx-optional{
  font-size:10px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--mut,#94a3b8);border:1px solid var(--line,#334155);
  border-radius:6px;padding:1px 6px;
}
.cc-rx-add{
  width:100%;
  background:#0b1224;color:var(--ink,#e8eefc);
  border:1px dashed var(--line,#334155);border-radius:12px;
  padding:16px;font-size:15px;font-weight:600;cursor:pointer;
}
.cc-rx-add:hover{border-color:var(--accent,#6366f1)}

.cc-rx-preview{display:flex;flex-direction:column;gap:12px}
.cc-rx-img{
  width:100%;max-height:260px;object-fit:contain;
  background:#0b1224;border:1px solid var(--line,#334155);border-radius:12px;
}
.cc-rx-actions{display:flex;align-items:center;gap:10px}
.cc-rx-up{
  flex:1;background:linear-gradient(90deg,#6366f1,#4f46e5);color:#fff;
  border:none;border-radius:10px;padding:12px;font-size:15px;font-weight:700;cursor:pointer;
}
.cc-rx-del{
  background:transparent;color:#fca5a5;
  border:1px solid rgba(248,113,113,.4);border-radius:10px;
  padding:12px 16px;font-size:14px;font-weight:600;cursor:pointer;
}
.cc-rx-del:hover{background:rgba(248,113,113,.1)}
.cc-rx-done{
  flex:1;color:var(--good,#22c55e);font-weight:700;font-size:15px;
  display:flex;align-items:center;
}
.cc-rx-msg{font-size:13px;margin-top:10px;min-height:0}
.cc-rx-msg.ok{color:var(--good,#22c55e)}
.cc-rx-msg.err{color:#fca5a5}