/* Light theme */
:root{
  --brand-700:#1c5574;
  --brand-500:#2a7eab;
  --brand-300:#9bc3da;
  --bg:#f7fbfe;
  --text:#0f1720;
  --muted:#6b7a86;
  --line:#d7e2ea;
  --card:#ffffff;
}

*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text)}

.cc-wrap{max-width:1100px;margin:24px auto;padding:0 16px}

/* Header */
.cc-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.cc-brand{display:flex;gap:12px;align-items:center}
.cc-logo{height:48px;width:auto;image-rendering:-webkit-optimize-contrast;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.15))}
.cc-brand-text h1{margin:0;font-size:20px;color:var(--brand-700)}
.cc-tagline{margin:2px 0 0;color:var(--muted);font-size:13px}
.cc-config-badge{font-size:12px;background:#e8f4fb;color:#1873a2;padding:6px 10px;border-radius:999px}
.cc-header-actions{display:flex;align-items:center;gap:10px}
.cc-admin-btn{
  background:#e0f4ff;color:#007bbf;font-size:13px;font-weight:600;text-decoration:none;
  padding:6px 12px;border-radius:9999px;border:1px solid #bde0f7;transition:all .2s ease;
}
.cc-admin-btn:hover{background:#cdefff;border-color:#99d3f4}
/* Buttons */
.cc-btn {
  appearance: none;
  border: 1px solid var(--line);
  background: #0b5cab;
  color: #fff;
  font: 600 14px/1 Inter, system-ui, Arial, sans-serif;
  padding: 8px 14px;
  border-radius: 10px;
  cursor: pointer;
}
.cc-btn:hover { filter: brightness(1.05); }
.cc-btn:disabled { opacity: .6; cursor: not-allowed; }

.cc-btn--secondary {
  background: #eef6ff;
  color: #0b5cab;
  border-color: #bcd7ff;
}
.cc-btn--icon {
  background: transparent;
  color: #6b7a86;
  border: 0;
  padding: 6px 8px;
  font-size: 18px;
}

/* Modal */
.cc-modal[hidden] { display: none; }
.cc-modal {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
}
.cc-modal__overlay {
  position: absolute; inset: 0; background: rgba(15, 42, 58, .35);
}
.cc-modal__dialog {
  position: relative;
  max-width: 960px; width: 92vw; max-height: 80vh;
  background: #fff; border: 1px solid var(--line);
  border-radius: 14px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,.12);
  display: flex; flex-direction: column;
}
.cc-modal__header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; border-bottom: 1px solid var(--line);
}
.cc-modal__body {
  padding: 12px 14px; overflow: auto;
}
.cc-card table { width: 100%; border-collapse: collapse; }
.cc-card th, .cc-card td { padding: 8px 6px; border-bottom: 1px solid var(--line); font-size: 14px; }
.cc-card th { color: var(--muted); font-weight: 600; }

.cc-modal__toolbar {
  display: flex; gap: 10px; align-items: center;
  padding: 10px 14px; border-bottom: 1px solid var(--line); background: #fbfdff;
}
#cc-quotes-search {
  flex: 1; height: 36px; padding: 6px 10px; border: 1px solid var(--line);
  border-radius: 8px; font: 14px/1 Inter, system-ui, Arial, sans-serif;
}
.cc-tag-legend .tag { display: inline-block; padding: 4px 8px; border-radius: 999px; font-size: 12px; margin-left: 6px; border: 1px solid var(--line);}
.tag--prospect { background: #eef7ff; }
.tag--sent { background: #f7f7ff; }
.tag--closed { background: #eefaf0; }
.cc-inline-form {
  display: flex; gap: 10px; align-items: center; padding: 10px 14px;
  border-bottom: 1px solid var(--line); background: #fbfdff;
}
.cc-inline-form select {
  height: 36px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px;
}
.cc-pagination { display: flex; gap: 10px; align-items: center; justify-content: center; padding: 10px 0 14px; }


/* Form fields */
.cc-field{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.cc-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:900px){.cc-grid-3{grid-template-columns:1fr}}
.cc-advanced summary{cursor:pointer;margin-top:8px}

input,select{
  border:1px solid var(--line);background:#fff;border-radius:8px;padding:10px 12px;font-size:14px
}

/* Add-ons */
.cc-h2{margin:18px 0 8px;color:var(--brand-700);font-size:18px}
.cc-addons-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:10px}
@media (max-width:900px){.cc-addons-grid{grid-template-columns:1fr}}
.cc-addon{display:flex;gap:10px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px}
.cc-addon .meta{font-size:12px;color:var(--muted)}

/* Tiers */
.cc-tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:1100px){.cc-tier-grid{grid-template-columns:1fr}}
.cc-tier{border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,0.05)}
.cc-tag{display:inline-block;padding:4px 10px;border:1px solid var(--brand-500);border-radius:999px;font-weight:600;margin-bottom:10px}
.cc-kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:6px}
.cc-kpi span{font-size:12px;color:var(--muted)}
.cc-kpi b{font-size:16px}
.cc-price{font-size:28px;font-weight:800;margin-top:8px}

/* Legacy tier accents (optional) */
.cc-tier-essential{background:#f0f8ff;border-left:5px solid #007bbf}
.cc-tier-standard{background:#f5f5f5;border-left:5px solid #777}
.cc-tier-executive{background:#fff8e1;border-left:5px solid #caa200}

/* Notes */
.cc-notes{margin-top:10px;color:var(--muted);font-size:13px}

/* Buttons */
.cc-btn{
  background:var(--brand-500);color:#fff;border:0;border-radius:10px;padding:10px 14px;
  font-weight:700;cursor:pointer;transition:filter .15s ease
}
.cc-btn:hover{filter:brightness(0.95)}
.cc-btn-secondary{background:#e0f4ff;color:#0b5f8a;border:1px solid #bfe3f8}
.cc-btn {
  appearance: none;
  -webkit-appearance: none;
  display: inline-block;
  text-decoration: none;      /* prevents underline if it's an <a> */
  background: var(--brand-500);
  color: #fff;
  border: 0;
  border-radius: 10px;
  padding: 10px 14px;
  font-weight: 700;
  cursor: pointer;
  transition: filter .15s ease;
}
.cc-btn:hover { filter: brightness(0.95); }
.cc-btn-secondary {
  background: #e0f4ff;
  color: #0b5f8a;
  border: 1px solid #bfe3f8;
}


/* Summary section (View/Email + fields) */
.cc-summary{margin:24px 0}
.cc-summary .cc-actions{
  display:grid;grid-template-columns:1fr;gap:12px;
  max-width:760px;margin:0 auto 14px;background:#f6fbff;border:1px solid #e3eef6;
  border-radius:12px;padding:16px
}
.cc-summary .cc-input{
  width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:10px 12px;font-size:15px
}
.cc-summary .cc-btn{padding:12px 16px}

/* On wider screens: button | two inputs | button */
@media (min-width:720px){
  .cc-summary .cc-actions{
    grid-template-columns:auto 1fr auto;align-items:start
  }
  .cc-summary .cc-fields{
    display:grid;grid-template-columns:1fr 1fr;gap:10px
  }
}

/* Summary output */
.cc-summary-pre{
  white-space:pre-wrap;border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px
}

/* Modal */
.cc-modal.cc-hidden{display:none}
.cc-modal{position:fixed;inset:0;z-index:1000}
.cc-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,32,0.45)}
.cc-modal-content{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(92vw,420px);background:#fff;border:1px solid #d7e2ea;border-radius:14px;
  padding:16px;box-shadow:0 10px 30px rgba(0,0,0,0.15)
}
.cc-modal-title{margin:4px 0 6px;font-size:18px;color:#1c5574}
.cc-modal-sub{margin:0 0 10px;color:#6b7a86;font-size:13px}
.cc-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.cc-input{width:100%;border:1px solid #d7e2ea;border-radius:10px;padding:10px 12px;font-size:14px}
.cc-email-inline {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: #fbfdff;
}
.cc-email-inline .row {
  display: grid;
  grid-template-columns: 1fr 1fr auto auto;
  gap: 8px;
  align-items: center;
}
.cc-email-inline input {
  height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: 14px/1 Inter, system-ui, Arial, sans-serif;
}
.cc-email-inline .actions { display: contents; }

/* Tier color coding: Good / Better / Best */
.cc-tier--good {
  border: 2px solid #4caf50;
  background: #e8f6e9;
}

.cc-tier--better {
  border: 2px solid #2196f3;
  background: #e8f2fb;
}

.cc-tier--best {
  border: 2px solid #ff9800;
  background: #fff5e6;
}



/* Footer */
.cc-footer{display:flex;gap:8px;align-items:center;justify-content:center;color:var(--muted);font-size:13px;margin:24px 0}