/* Small single-card calculators (regra de três, horas trabalhadas). Same palette as the date calculator. */
.csim-app{
  --cs-ink:#172554;--cs-body:#3d4d6a;--cs-muted:#64748b;--cs-card:#fff;--cs-line:#e4ebf5;--cs-soft:#f3f6fb;
  --cs-blue:#2f6fed;--cs-blue-strong:#1d4ed8;--cs-blue-soft:#eef4ff;--cs-green:#047857;--cs-red:#b91c1c;
  box-sizing:border-box;width:min(1120px,100%);margin:0 0 28px;padding:16px;border-radius:22px;background:#f4f7fc;color:var(--cs-body)
}
.csim-app *,.csim-app *::before,.csim-app *::after{box-sizing:border-box}
.csim-app p,.csim-app h1,.csim-app h2,.csim-app ul,.csim-app ol{margin:0;padding:0}
.csim-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;align-items:start}
.csim-card{background:var(--cs-card);border:1px solid var(--cs-line);border-radius:18px;padding:20px}
.csim-hero{display:flex;gap:14px;align-items:center;margin-bottom:16px}
.csim-hero-ico{flex:0 0 auto;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--cs-blue-soft);color:var(--cs-blue)}
.csim-title{font-size:26px;line-height:1.15;font-weight:800;color:var(--cs-ink)}
.csim-lede{font-size:15px;line-height:1.45;color:var(--cs-muted);margin-top:4px!important}
.csim-h2{font-size:17px;font-weight:800;color:var(--cs-ink);margin-bottom:10px!important}

.csim-seg{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:14px;background:var(--cs-soft);margin-bottom:14px}
.csim-seg button{min-height:40px;padding:8px 14px;border:0;border-radius:10px;background:transparent;font:inherit;font-size:14px;font-weight:700;color:var(--cs-body);cursor:pointer}
.csim-seg button.is-active{background:#fff;color:var(--cs-blue-strong);box-shadow:0 1px 3px rgba(15,23,42,.12)}

.csim-field{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:700;color:var(--cs-ink);min-width:0}
.csim-field input,.csim-field select{width:100%;min-height:46px;padding:10px 12px;border:1px solid #cfd9e8;border-radius:12px;font-size:17px;color:var(--cs-ink);background:#fff;font-variant-numeric:tabular-nums}
.csim-field input:focus,.csim-field select:focus{border-color:var(--cs-blue);box-shadow:0 0 0 3px rgba(47,111,237,.15)}
.csim-field input.is-x{background:var(--cs-blue-soft);border-style:dashed;color:var(--cs-blue-strong);font-weight:800}
.csim-row{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:end}
.csim-arrow{padding-bottom:12px;font-size:18px;color:var(--cs-muted);font-weight:700}
.csim-rowlabel{font-size:13px;font-weight:700;color:var(--cs-muted);margin:12px 0 6px!important}
.csim-rowlabel:first-of-type{margin-top:0!important}

.csim-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.csim-chip{min-height:34px;padding:6px 12px;border-radius:999px;border:1px solid var(--cs-line);background:#fff;font:inherit;font-size:13px;color:var(--cs-body);cursor:pointer}
.csim-chip:hover{border-color:#b9cbea;background:#fbfcff}

.csim-result{background:linear-gradient(135deg,#1d4ed8,#4f46e5);color:#fff;border-radius:16px;padding:20px}
.csim-result-label{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;opacity:.88}
.csim-result-big{font-size:34px;line-height:1.1;font-weight:800;margin:6px 0 2px!important;word-break:break-word;font-variant-numeric:tabular-nums}
.csim-result-sub{font-size:15px;opacity:.9}
.csim-steps{margin-top:14px!important;padding:14px!important;border-radius:14px;background:var(--cs-soft);font-size:15px;line-height:1.6;color:var(--cs-body);list-style:none}
.csim-steps:empty{display:none}
.csim-steps li{list-style:none;margin:0}
.csim-steps code{font-family:inherit;font-weight:700;color:var(--cs-ink);font-variant-numeric:tabular-nums}
.csim-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.csim-btn{min-height:44px;padding:10px 16px;border-radius:12px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;border:1px solid transparent}
.csim-btn-primary{background:var(--cs-blue);color:#fff}
.csim-btn-primary:hover{background:var(--cs-blue-strong)}
.csim-btn-ghost{background:#fff;color:var(--cs-blue-strong);border-color:#cfd9e8}
.csim-status{min-height:20px;font-size:14px;color:var(--cs-green);margin-top:8px!important}
.csim-warn{font-size:14px;color:var(--cs-red);margin-top:10px!important}

/* Horas trabalhadas: day table */
.csim-days{width:100%;border-collapse:separate;border-spacing:0 6px}
.csim-days th{font-size:12px;font-weight:700;color:var(--cs-muted);text-align:left!important;padding:0 4px 2px;text-transform:uppercase;letter-spacing:.03em;background:none!important;border:0!important}
.csim-days td{padding:0 4px!important;border:0!important;background:none!important;text-align:left!important;vertical-align:middle}
.csim-days td:first-child{font-weight:700;color:var(--cs-ink);font-size:14px;white-space:nowrap;padding-right:8px!important}
.csim-days input{width:100%;min-width:0;min-height:40px;padding:6px 6px;border:1px solid #cfd9e8;border-radius:10px;font-size:15px;color:var(--cs-ink);background:#fff;font-variant-numeric:tabular-nums}
.csim-days input:focus{border-color:var(--cs-blue);box-shadow:0 0 0 3px rgba(47,111,237,.15)}
.csim-days .csim-total{font-weight:800;color:var(--cs-ink);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:15px}
.csim-days tr.is-off td:first-child{color:var(--cs-muted)}
.csim-cfg{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:14px}
.csim-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.csim-kv{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin-top:14px;font-size:15px}
.csim-kv dt{color:var(--cs-body)}
.csim-kv dd{margin:0;font-weight:800;color:var(--cs-ink);text-align:right;font-variant-numeric:tabular-nums}
.csim-kv dd.is-pos{color:var(--cs-green)}
.csim-kv dd.is-neg{color:var(--cs-red)}

@media (max-width:860px){
  .csim-app{padding:10px;border-radius:16px}
  .csim-grid{grid-template-columns:minmax(0,1fr)}
  .csim-card{padding:14px}
  .csim-title{font-size:22px}
  .csim-result-big{font-size:28px}
  .csim-cfg{grid-template-columns:1fr 1fr}
}
@media (max-width:420px){.csim-row{grid-template-columns:1fr;gap:6px}.csim-arrow{display:none}}

[data-theme="dark"] .csim-app{
  --cs-ink:#e7ecf5;--cs-body:#c4cddd;--cs-muted:#9aa3b5;--cs-card:#161c28;--cs-line:#2a3242;--cs-soft:#1d2433;--cs-blue-soft:#1e2a47;
  --cs-green:#34d399;--cs-red:#f87171;background:#10151f
}
[data-theme="dark"] .csim-field input,[data-theme="dark"] .csim-field select,[data-theme="dark"] .csim-days input,[data-theme="dark"] .csim-chip,[data-theme="dark"] .csim-btn-ghost{background:#161c28;border-color:#2a3242;color:var(--cs-ink)}
[data-theme="dark"] .csim-seg button.is-active{background:#2a3242;color:#8fb0ff}
[data-theme="dark"] .csim-field input.is-x{background:#1e2a47;color:#8fb0ff}

/* Wide variant (horas trabalhadas): the day table needs more room than the result card. */
.csim-app.is-wide .csim-grid{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr)}
.csim-days{table-layout:fixed;min-width:500px}
.csim-days col.c-day{width:78px}
.csim-days col.c-total{width:60px}
.csim-days tr,.csim-days tbody tr:nth-child(odd),.csim-days tbody tr:nth-child(even),.csim-days thead tr{background:transparent!important;box-shadow:none!important}
.csim-days input[type=time]{padding:6px 4px;font-size:14px}
@media (max-width:860px){.csim-app.is-wide .csim-grid{grid-template-columns:minmax(0,1fr)}}
/* Article CSS turns tables into flex rows; this one needs real columns. */
.csim-days{display:table!important}
.csim-days thead{display:table-header-group!important}
.csim-days tbody{display:table-row-group!important}
.csim-days tr{display:table-row!important;height:auto!important;margin:0!important;padding:0!important}
.csim-days th,.csim-days td{display:table-cell!important;width:auto}