/* ===== 手取り計算ツール tedori-keisan.css ===== */
:root{
  --ts-wine:#5c0119;
  --ts-gold:#f2cb4e;
  --ts-line:#e7e0e2;
  --ts-soft:#7a6f72;
  --ts-bg:#faf7f3;
}

.ts-section{padding-top:24px;}

/* モード切替 */
.ts-modebar{
  display:inline-flex;background:#f1eae6;border-radius:999px;padding:5px;gap:4px;margin:0 auto 22px;
  flex-wrap:wrap;
}
.ts-mode{
  border:0;background:transparent;cursor:pointer;font:inherit;font-weight:700;color:var(--ts-soft);
  padding:10px 20px;border-radius:999px;transition:.15s;font-size:14px;
}
.ts-mode.is-active{background:var(--ts-wine);color:#fff;box-shadow:0 2px 8px rgba(92,1,25,.22);}
@media(max-width:560px){.ts-modebar{display:flex;}.ts-mode{flex:1;padding:10px 8px;}}

/* レイアウト */
.ts-layout{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:26px;align-items:start;}
@media(max-width:880px){.ts-layout{grid-template-columns:1fr;}}

/* 入力パネル */
.ts-panel{
  background:#fff;border:1px solid var(--ts-line);border-radius:16px;padding:22px;
  box-shadow:0 6px 22px rgba(60,20,30,.05);
}
.ts-field{margin-bottom:16px;}
.ts-field--big label{font-size:15px;}
.ts-field label,.ts-label{display:block;font-weight:700;color:#3a2b2f;margin-bottom:7px;font-size:14px;}
.ts-field .hint{display:block;font-weight:400;color:var(--ts-soft);font-size:12px;margin-top:2px;}
.ts-help{color:var(--ts-soft);font-size:12px;margin:6px 0 0;line-height:1.6;}

.ts-money{display:flex;align-items:center;border:1.5px solid var(--ts-line);border-radius:10px;overflow:hidden;background:#fff;}
.ts-money:focus-within{border-color:var(--ts-wine);}
.ts-money .cur{padding:0 4px 0 12px;color:var(--ts-soft);font-weight:700;}
.ts-money input{border:0;outline:0;padding:11px 12px 11px 4px;font:inherit;font-size:16px;width:100%;background:transparent;}
.ts-money--unit input{text-align:right;}
.ts-money .unit{padding:0 12px;color:var(--ts-soft);font-size:13px;white-space:nowrap;}
.ts-field--big .ts-money input{font-size:22px;font-weight:700;}

.ts-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media(max-width:480px){.ts-row2{grid-template-columns:1fr;}}

select{
  width:100%;padding:11px 12px;border:1.5px solid var(--ts-line);border-radius:10px;font:inherit;font-size:15px;
  background:#fff;color:#3a2b2f;
}
select:focus{outline:0;border-color:var(--ts-wine);}

.ts-seg{display:flex;flex-direction:column;gap:8px;}
.ts-seg label{display:flex;align-items:center;gap:8px;font-weight:500;color:#3a2b2f;font-size:14px;cursor:pointer;margin:0;}
.ts-seg input{accent-color:var(--ts-wine);width:17px;height:17px;}

.ts-check{
  display:flex;align-items:flex-start;gap:9px;font-weight:700;color:#3a2b2f;font-size:14px;cursor:pointer;
  padding:12px;border:1.5px solid var(--ts-line);border-radius:10px;margin-bottom:10px;line-height:1.5;
}
.ts-check input{accent-color:var(--ts-wine);width:18px;height:18px;margin-top:1px;flex:none;}
.ts-sub{padding:0 2px 6px;margin-bottom:8px;}

/* 料率パネル */
.ts-details-toggle{
  width:100%;text-align:left;background:var(--ts-bg);border:1px dashed #d8cfc4;border-radius:10px;
  padding:12px 14px;font:inherit;font-weight:700;font-size:13px;color:#6a5740;cursor:pointer;margin-top:6px;
  display:flex;justify-content:space-between;align-items:center;
}
.ts-details-toggle .chev{width:9px;height:9px;border-right:2px solid #6a5740;border-bottom:2px solid #6a5740;transform:rotate(45deg);transition:.2s;}
.ts-details-toggle[aria-expanded="true"] .chev{transform:rotate(-135deg);}
.ts-details{display:none;padding:14px 4px 2px;}
.ts-details.is-open{display:block;}
.ts-warn{background:#fff7e6;border:1px solid #f0dca6;border-radius:9px;padding:10px 12px;font-size:12px;color:#7a5b00;line-height:1.7;margin:0 0 14px;}
.ts-rate{margin-bottom:11px;}
.ts-rate label{display:block;font-size:13px;font-weight:700;color:#3a2b2f;margin-bottom:5px;}
.ts-rate .hint{display:block;font-weight:400;color:var(--ts-soft);font-size:11px;}
.ts-details hr{border:0;border-top:1px solid var(--ts-line);margin:14px 0;}

.ts-note{color:var(--ts-soft);font-size:12px;margin:14px 0 0;line-height:1.7;}

/* 結果 */
.ts-main{min-width:0;}
.ts-result{background:#fff;border:1px solid var(--ts-line);border-radius:16px;padding:24px;box-shadow:0 6px 22px rgba(60,20,30,.05);}
.ts-empty{color:var(--ts-soft);text-align:center;padding:40px 0;margin:0;}

.ts-hero{
  background:linear-gradient(135deg,#5c0119,#7a0a26);border-radius:14px;padding:24px;text-align:center;color:#fff;
  margin-bottom:24px;
}
.ts-hero-k{display:block;font-size:13px;opacity:.85;font-weight:500;letter-spacing:.04em;}
.ts-hero-v{display:block;font-size:40px;font-weight:700;line-height:1.1;margin:6px 0;color:var(--ts-gold);}
.ts-hero-sub{display:block;font-size:13px;opacity:.9;}
@media(max-width:480px){.ts-hero-v{font-size:32px;}}

.ts-block{margin-top:22px;}
.ts-h2{font-size:16px;color:var(--ts-wine);font-weight:700;margin:0 0 12px;padding-left:11px;border-left:4px solid var(--ts-gold);}

.ts-table{width:100%;border-collapse:collapse;font-size:15px;}
.ts-table th,.ts-table td{padding:11px 6px;border-bottom:1px solid #f0ebe7;text-align:left;}
.ts-table th{font-weight:500;color:#3a2b2f;}
.ts-table td{text-align:right;font-variant-numeric:tabular-nums;color:#3a2b2f;font-weight:500;}
.ts-tr-gross td{font-weight:700;}
.ts-tr-deduct th,.ts-tr-deduct td{color:#a23;font-weight:700;border-top:2px solid var(--ts-line);}
.ts-tr-net th,.ts-tr-net td{font-size:19px;font-weight:700;color:var(--ts-wine);border-bottom:0;}
.ts-est{display:inline-block;background:#eef;color:#558;font-size:10px;font-weight:700;padding:1px 6px;border-radius:5px;margin-left:6px;vertical-align:middle;}

.ts-cautions ul{margin:0;padding-left:20px;color:#52464a;font-size:13px;line-height:1.85;}
.ts-cautions li{margin-bottom:6px;}

@media print{
  .ts-modebar,.ts-panel,.ts-details-toggle,.ad-slot{display:none!important;}
  .ts-layout{grid-template-columns:1fr;}
}
