/* ============================================================
   calc-widget.css — UI compartilhada das calculadoras
   Dinheiro da Minha Empresa · Curadoria Brasil GEO
   ============================================================ */

.calc-widget{
  background:linear-gradient(180deg,#FFFFFF 0%,#F8FAFC 100%);
  border:1px solid var(--line);
  border-radius:14px;
  padding:28px;
  margin:32px 0 36px;
  box-shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px -16px rgba(15,23,42,.12);
}
@media(max-width:640px){.calc-widget{padding:20px;border-radius:10px;margin:24px 0 28px}}

.calc-widget__header{
  display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  flex-wrap:wrap;
  margin-bottom:18px;
  padding-bottom:14px;
  border-bottom:1px solid var(--line);
}
.calc-widget__title{
  font-size:18px;font-weight:800;color:var(--ink);
  letter-spacing:-.01em;
  display:flex;align-items:center;gap:10px;
  margin:0;
}
.calc-widget__title::before{
  content:"";
  width:8px;height:8px;border-radius:50%;
  background:var(--green);
  flex:none;
}
.calc-widget__badge{
  font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  background:var(--green-soft);color:var(--green-dark);
  padding:6px 11px;border-radius:99px;
  white-space:nowrap;
}
.calc-widget__intro{
  font-size:14px;color:var(--ink-3);line-height:1.55;
  margin:0 0 22px;
}

.calc-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
}
@media(min-width:780px){
  .calc-grid--split{grid-template-columns:1fr 1fr;gap:32px}
  .calc-grid--wide{grid-template-columns:1.2fr 1fr;gap:32px}
}

.calc-form{display:flex;flex-direction:column;gap:14px}
.calc-field{display:flex;flex-direction:column;gap:6px}
.calc-field__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:640px){.calc-field__row{grid-template-columns:1fr}}
.calc-field label{
  font-size:13px;font-weight:600;color:var(--ink-2);
  letter-spacing:.005em;
}
.calc-field__hint{font-size:11.5px;color:var(--muted);line-height:1.4;margin-top:2px}
.calc-field__suffix{position:relative}
.calc-field__suffix::after{
  content:attr(data-suffix);
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  color:var(--muted);font-size:13px;font-weight:500;pointer-events:none;
}
.calc-field__prefix{position:relative}
.calc-field__prefix::before{
  content:attr(data-prefix);
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  color:var(--muted);font-size:13px;font-weight:500;pointer-events:none;
}
.calc-field__prefix input{padding-left:34px !important}

.calc-input,
.calc-select{
  width:100%;
  appearance:none;-webkit-appearance:none;
  font:inherit;
  font-size:15px;
  padding:11px 13px;
  background:#FFFFFF;
  border:1px solid #CBD5E1;
  border-radius:8px;
  color:var(--ink);
  transition:border-color .15s ease,box-shadow .15s ease;
}
.calc-input:focus,
.calc-select:focus{
  outline:none;
  border-color:var(--green);
  box-shadow:0 0 0 3px rgba(0,168,104,.18);
}
.calc-select{
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%2364748B' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  padding-right:36px;
}

.calc-toggle{
  display:flex;gap:6px;
  background:#F1F5F9;
  border:1px solid #E2E8F0;
  border-radius:10px;
  padding:4px;
}
.calc-toggle__btn{
  flex:1;
  font:inherit;font-size:13px;font-weight:600;
  background:transparent;border:0;
  padding:8px 10px;border-radius:6px;
  cursor:pointer;color:var(--ink-3);
  transition:all .15s ease;
}
.calc-toggle__btn[aria-pressed="true"]{
  background:#FFFFFF;color:var(--green-dark);
  box-shadow:0 1px 3px rgba(15,23,42,.08);
}

.calc-result{
  background:linear-gradient(160deg,#0F172A 0%,#1E293B 100%);
  color:#F8FAFC;
  border-radius:12px;
  padding:24px;
  display:flex;flex-direction:column;gap:18px;
}
.calc-result__primary{display:flex;flex-direction:column;gap:6px}
.calc-result__label{
  font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:#94A3B8;
}
.calc-result__value{
  font-size:34px;font-weight:800;letter-spacing:-.02em;
  color:#FFFFFF;line-height:1.05;
  font-variant-numeric:tabular-nums;
}
.calc-result__value--green{color:#34D399}
.calc-result__value--red{color:#F87171}
.calc-result__value--small{font-size:24px}
.calc-result__sub{
  font-size:13px;color:#CBD5E1;line-height:1.5;margin:0;
}
.calc-result__sub strong{color:#FFFFFF;font-weight:600}

.calc-breakdown{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  overflow:hidden;
}
.calc-breakdown__row{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:11px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
  font-size:13px;
  color:#CBD5E1;
}
.calc-breakdown__row:last-child{border-bottom:0}
.calc-breakdown__row strong{color:#FFFFFF;font-weight:600;font-variant-numeric:tabular-nums}
.calc-breakdown__row--total{
  background:rgba(0,168,104,.12);
  color:#FFFFFF;font-weight:600;
}
.calc-breakdown__row--total strong{color:#34D399}

.calc-actions{
  display:flex;flex-wrap:wrap;gap:10px;
  margin-top:6px;
}
.calc-btn{
  font:inherit;font-size:13px;font-weight:600;
  background:rgba(255,255,255,.12);
  color:#FFFFFF;
  border:1px solid rgba(255,255,255,.18);
  padding:9px 14px;border-radius:8px;
  cursor:pointer;
  transition:all .15s ease;
}
.calc-btn:hover{background:rgba(255,255,255,.2)}
.calc-btn--primary{background:var(--green);border-color:transparent}
.calc-btn--primary:hover{background:var(--green-dark)}

.calc-table{
  width:100%;
  margin:18px 0 0;
  font-size:13px;
  border-collapse:collapse;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  overflow:hidden;
}
.calc-table th,
.calc-table td{
  padding:9px 12px;
  text-align:left;
  border-bottom:1px solid rgba(255,255,255,.06);
  font-variant-numeric:tabular-nums;
}
.calc-table th{
  background:rgba(255,255,255,.04);
  font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:#94A3B8;
}
.calc-table tr:last-child td{border-bottom:0}
.calc-table td.num{text-align:right}

.calc-foot{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
  font-size:11.5px;color:var(--muted);line-height:1.5;
}
.calc-foot strong{color:var(--ink-3);font-weight:600}
.calc-foot a{color:var(--green-dark);text-decoration:underline;text-underline-offset:2px}

.calc-tabs{
  display:flex;gap:4px;
  margin-bottom:18px;
  border-bottom:1px solid var(--line);
  overflow-x:auto;
}
.calc-tab{
  font:inherit;font-size:13.5px;font-weight:600;
  background:transparent;border:0;
  padding:10px 14px;
  color:var(--ink-4);cursor:pointer;
  border-bottom:2px solid transparent;
  white-space:nowrap;
  transition:color .15s ease,border-color .15s ease;
}
.calc-tab[aria-selected="true"]{
  color:var(--green-dark);
  border-bottom-color:var(--green);
}

.calc-row-list{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.calc-row-item{
  display:grid;
  grid-template-columns:1fr 110px 110px 32px;
  gap:8px;align-items:center;
  padding:8px;
  background:#F8FAFC;
  border:1px solid var(--line);
  border-radius:8px;
}
@media(max-width:640px){
  .calc-row-item{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;}
  .calc-row-item .calc-row-item__remove{grid-row:1/3;grid-column:2}
}
.calc-row-item__remove{
  background:transparent;border:0;cursor:pointer;
  width:28px;height:28px;border-radius:6px;
  color:var(--muted);font-size:18px;
  display:inline-flex;align-items:center;justify-content:center;
}
.calc-row-item__remove:hover{background:#FEE2E2;color:#B91C1C}
.calc-add-btn{
  font:inherit;font-size:13px;font-weight:600;
  background:transparent;color:var(--green-dark);
  border:1px dashed #CBD5E1;
  padding:9px;border-radius:8px;
  cursor:pointer;margin-top:6px;
  transition:all .15s ease;
}
.calc-add-btn:hover{border-color:var(--green);background:var(--green-soft)}

.calc-empty{
  color:var(--muted);
  font-size:13px;
  text-align:center;
  padding:18px;
  background:#F8FAFC;border:1px dashed var(--line);border-radius:8px;
  margin:8px 0;
}

[data-calc-output]{font-variant-numeric:tabular-nums}

.calc-share{
  display:flex;flex-wrap:wrap;gap:8px;
  width:100%;
  margin-top:8px;
  padding-top:14px;
  border-top:1px dashed var(--line);
}
.calc-widget__header .calc-share{margin-top:14px;border-top-style:solid}
.calc-share__btn{
  font:inherit;font-size:12.5px;font-weight:600;
  display:inline-flex;align-items:center;gap:7px;
  background:var(--green-soft);color:var(--green-dark);
  border:1px solid transparent;
  padding:8px 13px;border-radius:99px;
  cursor:pointer;
  transition:all .15s ease;
}
.calc-share__btn:hover{background:var(--green);color:#FFFFFF}
.calc-share__btn--ghost{
  background:transparent;color:var(--muted);
  border-color:#CBD5E1;
}
.calc-share__btn--ghost:hover{background:#FEF2F2;color:#B91C1C;border-color:#FCA5A5}
.calc-share__btn svg{flex:none}
@media(max-width:640px){
  .calc-share{gap:6px}
  .calc-share__btn{font-size:11.5px;padding:7px 11px}
}

.calc-pill-list{display:flex;flex-wrap:wrap;gap:6px}
.calc-pill{
  font-size:11.5px;font-weight:600;
  background:#F1F5F9;color:var(--ink-3);
  padding:5px 10px;border-radius:99px;
  border:1px solid #E2E8F0;
}
.calc-pill--ok{background:var(--green-soft);color:var(--green-dark);border-color:transparent}
.calc-pill--warn{background:#FEF3C7;color:#92400E;border-color:transparent}
.calc-pill--danger{background:#FEE2E2;color:#B91C1C;border-color:transparent}
