[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"footer-root-categories-fr-FR":3,"tool-content-outil-idcc16-fr":83,"footer-cities-fr":165},[4,14,22,30,38,45,53,60,67,75],{"seo_content":5,"id":8,"name":9,"slug":10,"parentId":7,"lang":11,"_count":12},[6],{"page_slug":7},null,"cmkzhl7xm00dbulbc93h4qog5","Juridique","avocats","fr-FR",{"experts":13},8,{"seo_content":15,"id":17,"name":18,"slug":19,"parentId":7,"lang":11,"_count":20},[16],{"page_slug":7},"cmkzhl84700djulbcbv6pzu9e","Informatique","informaticiens",{"experts":21},3,{"seo_content":23,"id":25,"name":26,"slug":27,"parentId":7,"lang":11,"_count":28},[24],{"page_slug":7},"cmkzhlaos00gnulbc07i9jrco","Amélioration de la Maison","artisans",{"experts":29},4,{"seo_content":31,"id":33,"name":34,"slug":35,"parentId":7,"lang":11,"_count":36},[32],{"page_slug":7},"cmkzhlaqg00gpulbcx38bwoc2","Général","divers-generalistes",{"experts":37},0,{"seo_content":39,"id":41,"name":42,"slug":43,"parentId":7,"lang":11,"_count":44},[40],{"page_slug":7},"cmkzhlbvq00i3ulbcutdbcz50","Électronique Grand Public","techniciens-electronique",{"experts":21},{"seo_content":46,"id":48,"name":49,"slug":50,"parentId":7,"lang":11,"_count":51},[47],{"page_slug":7},"cmkzhlcaw00ilulbc38pxoogr","Santé","medecins",{"experts":52},5,{"seo_content":54,"id":56,"name":57,"slug":58,"parentId":7,"lang":11,"_count":59},[55],{"page_slug":7},"cmkzhlcmi00izulbcxva1m47f","Gestion de Patrimoine","conseillers-patrimoniaux",{"experts":21},{"seo_content":61,"id":63,"name":64,"slug":65,"parentId":7,"lang":11,"_count":66},[62],{"page_slug":7},"cmkzhldcv00jvulbcmcd5a7mk","Animaux et Vétérinaires","veterinaires",{"experts":21},{"seo_content":68,"id":70,"name":71,"slug":72,"parentId":7,"lang":11,"_count":73},[69],{"page_slug":7},"cmkzhldrr00kdulbchxfo67eg","Mécanique et Réparation","mecaniciens",{"experts":74},1,{"seo_content":76,"id":78,"name":79,"slug":80,"parentId":7,"lang":11,"_count":81},[77],{"page_slug":7},"cmkzhl9l300fbulbcv3i8q8p3","Aide aux Devoirs","professeurs-particuliers",{"experts":82},6,{"slug":84,"title":85,"page_title":86,"description":87,"content_md":88,"local_slug":84,"json_ld":89,"faq":139,"tool_html":160,"source":161,"category":7,"audience":162,"publish_mode":163,"hero_image":164,"hero_image_alt":85},"outil-idcc16","Convention Collective Transports Routiers IDCC 16 – Outil complet","Outil IDCC 16 – Transports Routiers : Salaires & Calculs","Calculez salaire minimum, heures supplémentaires, prime d'ancienneté et indemnités de la convention collective des transports routiers (IDCC 16).","Cet outil interactif vous permet de simuler et calculer tous les éléments de rémunération prévus par la Convention Collective Nationale des Transports Routiers (IDCC 16) : salaire minimum par coefficient, majoration des heures supplémentaires (25 % et 50 %), prime d'ancienneté, indemnités de déplacement et de découché, ainsi que la conformité aux règles de repos et durée de conduite. Adapté aux conducteurs PL, SPL, grand routier et au personnel sédentaire (employés, TAM, cadres).",[90,118],{"name":91,"@type":92,"about":93,"author":97,"offers":101,"@context":105,"inLanguage":106,"description":107,"featureList":108,"operatingSystem":115,"applicationCategory":116,"isAccessibleForFree":117},"Outil Convention Collective Transports Routiers IDCC 16","WebApplication",{"name":94,"@type":95,"identifier":96},"Convention Collective Nationale des Transports Routiers","Thing","IDCC 16",{"url":98,"name":99,"@type":100},"https:\u002F\u002Fwww.expert-zoom.com","Expert-Zoom","Organization",{"@type":102,"price":103,"priceCurrency":104},"Offer","0","EUR","https:\u002F\u002Fschema.org","fr","Outil interactif complet pour la convention collective des transports routiers (IDCC 16) : calcul du salaire minimum conventionnel, heures supplémentaires, prime d'ancienneté, indemnités de déplacement et règles de repos.",[109,110,111,112,113,114],"Calcul du salaire minimum conventionnel par coefficient","Calculateur d'heures supplémentaires (tranches 25% et 50%)","Simulateur de prime d'ancienneté","Calculateur d'indemnités de déplacement et de découché","Vérificateur de conformité repos et durée de conduite","Grille nationale des salaires IDCC 16","All","BusinessApplication",true,{"@type":119,"@context":105,"mainEntity":120},"FAQPage",[121,127,131,135],{"name":122,"@type":123,"acceptedAnswer":124},"Qu'est-ce que la convention collective IDCC 16 ?","Question",{"text":125,"@type":126},"L'IDCC 16 désigne la Convention Collective Nationale des Transports Routiers et Activités Auxiliaires du Transport (CCNTR). Elle régit les conditions de travail, salaires minima, congés, heures supplémentaires et indemnités de déplacement des salariés du secteur transport routier en France.","Answer",{"name":128,"@type":123,"acceptedAnswer":129},"Quel est le salaire minimum d'un conducteur SPL en 2026 ?",{"text":130,"@type":126},"En 2026, le taux horaire minimum conventionnel d'un conducteur SPL (coefficient M125) est d'environ 12,85 €\u002Fheure, soit un salaire mensuel brut de base d'environ 2 171 € pour 169 heures mensuelles, hors primes d'ancienneté et heures supplémentaires.",{"name":132,"@type":123,"acceptedAnswer":133},"Comment se calcule la prime d'ancienneté dans les transports routiers (IDCC 16) ?",{"text":134,"@type":126},"La prime d'ancienneté IDCC 16 est calculée en pourcentage du salaire de base conventionnel : 0 % de 0 à 2 ans, 3 % de 3 à 5 ans, 6 % de 6 à 9 ans, 9 % de 10 à 14 ans, 12 % de 15 à 19 ans, et 15 % à partir de 20 ans d'ancienneté pour les ouvriers et employés.",{"name":136,"@type":123,"acceptedAnswer":137},"Quelles sont les majorations pour heures supplémentaires selon l'IDCC 16 ?",{"text":138,"@type":126},"L'IDCC 16 prévoit 25 % de majoration pour les heures entre la 36ème et la 43ème heure hebdomadaire, et 50 % de majoration à partir de la 44ème heure. Le contingent annuel est de 220 heures.",[140,142,144,146,148,151,154,157],{"a":141,"q":122},"L'IDCC 16 désigne la Convention Collective Nationale des Transports Routiers et Activités Auxiliaires du Transport (CCNTR). Elle régit les conditions de travail, salaires minima, congés, heures supplémentaires et indemnités de déplacement des salariés du secteur transport routier en France. Elle s'applique aux conducteurs PL, SPL, VL, ainsi qu'aux personnels sédentaires (employés, TAM, cadres) des entreprises de transport.",{"a":143,"q":128},"En 2026, le taux horaire minimum conventionnel d'un conducteur SPL (coefficient M125 de la grille IDCC 16) est d'environ 12,85 €\u002Fheure, soit un salaire mensuel brut de base d'environ 2 171 € pour 169 heures mensuelles. Ce montant peut être majoré par les primes d'ancienneté, les heures supplémentaires et les indemnités de déplacement. Consultez toujours la dernière NAO signée dans votre branche.",{"a":145,"q":132},"La prime d'ancienneté IDCC 16 est calculée en pourcentage du salaire de base conventionnel. Pour les ouvriers et employés, le taux est : 0 % de 0 à 2 ans, 3 % de 3 à 5 ans, 6 % de 6 à 9 ans, 9 % de 10 à 14 ans, 12 % de 15 à 19 ans, et 15 % à partir de 20 ans d'ancienneté. Pour les TAM et cadres, le barème est légèrement différent. La prime est calculée sur le salaire minimum conventionnel, pas nécessairement sur le salaire réel si celui-ci est supérieur.",{"a":147,"q":136},"L'IDCC 16 prévoit deux tranches de majoration pour les heures supplémentaires : 25 % de majoration pour les heures effectuées entre la 36ème et la 43ème heure hebdomadaire, et 50 % de majoration à partir de la 44ème heure. Le contingent annuel d'heures supplémentaires est fixé à 220 heures. Au-delà, les heures doivent donner lieu à un repos compensateur obligatoire (RCO) de 100 %, sauf accord d'entreprise plus favorable.",{"a":149,"q":150},"L'IDCC 16 prévoit des indemnités journalières pour les conducteurs en déplacement. Pour la longue distance, l'indemnité de repas est d'environ 11,40 € par repas, et l'indemnité de découché (nuit hors domicile) est d'environ 24,60 € par nuit. Pour les transports internationaux, les tarifs sont supérieurs. Ces indemnités sont exonérées de cotisations sociales dans les limites fixées par l'URSSAF.","Quelles sont les indemnités de repas et de découché prévues par la convention collective des transports routiers ?",{"a":152,"q":153},"La durée maximale de conduite est régie par le règlement européen CE 561\u002F2006, qui s'applique aux transports routiers. Elle est limitée à 9 heures par jour, avec possibilité d'extension à 10 heures deux fois par semaine. Le temps de conduite hebdomadaire est limité à 56 heures, et à 90 heures sur deux semaines consécutives. Une pause de 45 minutes (ou 15 + 30 minutes) est obligatoire après 4h30 de conduite. L'IDCC 16 peut prévoir des règles complémentaires plus protectrices pour les salariés.","Quelle est la durée maximale de conduite autorisée par jour selon l'IDCC 16 ?",{"a":155,"q":156},"Selon l'IDCC 16, le repos hebdomadaire normal est de 45 heures consécutives minimum. Un repos réduit à 24 heures minimum est possible mais doit être compensé dans les 3 semaines suivantes. Ces dispositions sont plus favorables que le droit commun du travail. Pour les conducteurs soumis au règlement CE 561\u002F2006, le repos normal est de 45 heures, avec possibilité de le réduire à 24 heures (repos réduit), à condition de compenser la réduction avant la fin de la troisième semaine suivante.","Quelle est la durée du repos hebdomadaire dans les transports routiers ?",{"a":158,"q":159},"L'IDCC 16 s'applique à toutes les entreprises dont l'activité principale relève du transport routier de marchandises, du déménagement, de la location de véhicules industriels avec conducteur, ou des activités auxiliaires de transport (messagerie, logistique). Elle est étendue par arrêté ministériel, ce qui signifie qu'elle s'impose à toutes les entreprises du secteur, qu'elles soient adhérentes ou non aux organisations patronales signataires. Des accords d'entreprise peuvent prévoir des dispositions plus avantageuses, mais jamais moins favorables.","L'IDCC 16 s'applique-t-elle à toutes les entreprises de transport routier en France ?","\u003C!DOCTYPE html>\n\u003Chtml lang=\"fr\">\n\u003Chead>\n  \u003Cmeta charset=\"UTF-8\">\n  \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  \u003Ctitle>Convention Collective Transports Routiers (IDCC 16) – Outil interactif\u003C\u002Ftitle>\n  \u003Cscript src=\"https:\u002F\u002Funpkg.com\u002Flucide@latest\u002Fdist\u002Fumd\u002Flucide.min.js\">\u003C\u002Fscript>\n  \u003Cstyle>\n    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\n    body {\n      font-family: system-ui, -apple-system, sans-serif;\n      background: #fafaf9;\n      color: #1c1917;\n      padding: 24px;\n      max-width: 900px;\n      margin: 0 auto;\n    }\n\n    h1 { font-size: 1.25rem; font-weight: 700; color: #1c1917; margin-bottom: 4px; }\n    .subtitle { font-size: 0.875rem; color: #78716c; margin-bottom: 24px; }\n\n    \u002F* Tab navigation *\u002F\n    .tabs {\n      display: flex;\n      gap: 6px;\n      flex-wrap: wrap;\n      margin-bottom: 24px;\n    }\n    .tab-btn {\n      padding: 8px 14px;\n      border-radius: 8px;\n      border: none;\n      cursor: pointer;\n      font-size: 0.8125rem;\n      font-weight: 500;\n      transition: background 150ms, color 150ms;\n      background: #f5f5f4;\n      color: #57534e;\n    }\n    .tab-btn.active {\n      background: #1c1917;\n      color: #ffffff;\n    }\n    .tab-btn:hover:not(.active) { background: #e7e5e4; }\n\n    .tab-panel { display: none; }\n    .tab-panel.active { display: block; }\n\n    \u002F* Cards *\u002F\n    .card {\n      background: #ffffff;\n      border: 1px solid #e7e5e4;\n      border-radius: 12px;\n      padding: 24px;\n      margin-bottom: 16px;\n    }\n    .card-title {\n      font-size: 0.9375rem;\n      font-weight: 600;\n      color: #1c1917;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      margin-bottom: 16px;\n    }\n    .card-title i { color: #2563eb; flex-shrink: 0; }\n\n    \u002F* Fields *\u002F\n    .field { margin-bottom: 16px; }\n    .field:last-child { margin-bottom: 0; }\n    .field-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 6px;\n    }\n    label { font-size: 0.875rem; font-weight: 500; color: #44403c; }\n    .field-value { font-size: 0.875rem; font-weight: 600; color: #2563eb; }\n    .helper { font-size: 0.75rem; color: #78716c; margin-top: 4px; }\n\n    input[type=\"range\"] {\n      width: 100%;\n      accent-color: #2563eb;\n      cursor: pointer;\n    }\n\n    input[type=\"number\"], select {\n      width: 100%;\n      padding: 8px 12px;\n      border: 1px solid #d6d3d1;\n      border-radius: 8px;\n      font-size: 0.875rem;\n      color: #1c1917;\n      background: #fff;\n      outline: none;\n      transition: border-color 150ms, box-shadow 150ms;\n    }\n    input[type=\"number\"]:focus, select:focus {\n      border-color: #3b82f6;\n      box-shadow: 0 0 0 3px rgba(59,130,246,0.15);\n    }\n\n    .input-group {\n      display: flex;\n      align-items: center;\n      gap: 0;\n    }\n    .input-group input[type=\"number\"] {\n      border-radius: 8px 0 0 8px;\n      border-right: none;\n    }\n    .input-group .suffix {\n      padding: 8px 12px;\n      background: #f5f5f4;\n      border: 1px solid #d6d3d1;\n      border-radius: 0 8px 8px 0;\n      font-size: 0.875rem;\n      color: #78716c;\n      white-space: nowrap;\n    }\n\n    \u002F* Pills *\u002F\n    .pills {\n      display: flex;\n      gap: 6px;\n      flex-wrap: wrap;\n    }\n    .pill {\n      padding: 6px 14px;\n      border-radius: 8px;\n      border: none;\n      cursor: pointer;\n      font-size: 0.8125rem;\n      font-weight: 500;\n      transition: background 150ms, color 150ms;\n      background: #f5f5f4;\n      color: #57534e;\n    }\n    .pill.active { background: #1c1917; color: #ffffff; }\n    .pill:hover:not(.active) { background: #e7e5e4; }\n\n    \u002F* Results *\u002F\n    .results-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n      gap: 12px;\n      margin-bottom: 16px;\n    }\n    .result-card {\n      background: #eff6ff;\n      border: 1px solid #bfdbfe;\n      border-radius: 10px;\n      padding: 16px;\n    }\n    .result-card.success { background: #f0fdf4; border-color: #86efac; }\n    .result-card.warning { background: #fff7ed; border-color: #fed7aa; }\n    .result-card.neutral { background: #f5f5f4; border-color: #d6d3d1; }\n\n    .result-label { font-size: 0.75rem; color: #78716c; margin-bottom: 4px; }\n    .result-value {\n      font-size: 1.25rem;\n      font-weight: 700;\n      color: #1c1917;\n      font-variant-numeric: tabular-nums;\n    }\n    .result-value.blue { color: #2563eb; }\n    .result-value.green { color: #16a34a; }\n    .result-value.orange { color: #ea580c; }\n    .result-sub { font-size: 0.75rem; color: #78716c; margin-top: 2px; }\n\n    \u002F* Breakdown table *\u002F\n    .breakdown {\n      width: 100%;\n      border-collapse: collapse;\n      font-size: 0.8125rem;\n    }\n    .breakdown th {\n      text-align: left;\n      padding: 8px 12px;\n      background: #f5f5f4;\n      color: #44403c;\n      font-weight: 500;\n      border-bottom: 1px solid #e7e5e4;\n    }\n    .breakdown td {\n      padding: 8px 12px;\n      border-bottom: 1px solid #f5f5f4;\n      color: #1c1917;\n    }\n    .breakdown tr:last-child td { border-bottom: none; }\n    .breakdown td.amount { text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; }\n    .breakdown td.label { color: #57534e; }\n    .breakdown tr.total td { font-weight: 700; background: #f0f9ff; }\n    .breakdown tr.total td.amount { color: #2563eb; }\n\n    \u002F* Info boxes *\u002F\n    .info-box {\n      display: flex;\n      gap: 10px;\n      padding: 12px 14px;\n      border-radius: 8px;\n      font-size: 0.8125rem;\n      line-height: 1.5;\n      margin-top: 16px;\n    }\n    .info-box.blue { background: #eff6ff; color: #1e40af; border: 1px solid #bfdbfe; }\n    .info-box.orange { background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; }\n    .info-box.green { background: #f0fdf4; color: #14532d; border: 1px solid #86efac; }\n    .info-box i { flex-shrink: 0; margin-top: 1px; }\n\n    \u002F* Two-column layout *\u002F\n    .two-col {\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 16px;\n    }\n    @media (max-width: 600px) { .two-col { grid-template-columns: 1fr; } }\n\n    \u002F* Grille des salaires *\u002F\n    .salary-table {\n      width: 100%;\n      border-collapse: collapse;\n      font-size: 0.8125rem;\n    }\n    .salary-table th {\n      padding: 8px 12px;\n      background: #1c1917;\n      color: #fff;\n      text-align: left;\n      font-weight: 500;\n    }\n    .salary-table td {\n      padding: 8px 12px;\n      border-bottom: 1px solid #e7e5e4;\n      color: #1c1917;\n    }\n    .salary-table tr:last-child td { border-bottom: none; }\n    .salary-table tr.highlighted td { background: #eff6ff; font-weight: 600; }\n    .salary-table td.amount { text-align: right; font-variant-numeric: tabular-nums; }\n\n    \u002F* Section headers *\u002F\n    .section-header {\n      font-size: 0.8125rem;\n      font-weight: 600;\n      text-transform: uppercase;\n      letter-spacing: 0.05em;\n      color: #78716c;\n      margin-bottom: 12px;\n      margin-top: 4px;\n    }\n\n    \u002F* Toggle *\u002F\n    .toggle-group { display: flex; align-items: center; justify-content: space-between; }\n    .toggle {\n      position: relative;\n      display: inline-block;\n      width: 40px;\n      height: 22px;\n    }\n    .toggle input { opacity: 0; width: 0; height: 0; }\n    .toggle-slider {\n      position: absolute;\n      cursor: pointer;\n      inset: 0;\n      background: #d6d3d1;\n      border-radius: 22px;\n      transition: 150ms;\n    }\n    .toggle-slider:before {\n      content: \"\";\n      position: absolute;\n      width: 16px; height: 16px;\n      left: 3px; top: 3px;\n      background: white;\n      border-radius: 50%;\n      transition: 150ms;\n    }\n    .toggle input:checked + .toggle-slider { background: #2563eb; }\n    .toggle input:checked + .toggle-slider:before { transform: translateX(18px); }\n\n    \u002F* Badge *\u002F\n    .badge {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n      padding: 3px 8px;\n      border-radius: 20px;\n      font-size: 0.6875rem;\n      font-weight: 500;\n    }\n    .badge.blue { background: #dbeafe; color: #1d4ed8; }\n    .badge.green { background: #dcfce7; color: #15803d; }\n    .badge.orange { background: #ffedd5; color: #c2410c; }\n\n    \u002F* Source note *\u002F\n    .source-note {\n      font-size: 0.6875rem;\n      color: #a8a29e;\n      text-align: right;\n      margin-top: 10px;\n    }\n  \u003C\u002Fstyle>\n\u003C\u002Fhead>\n\u003Cbody>\n\n  \u003Ch1>\n    \u003Ci data-lucide=\"truck\" style=\"width:20px;height:20px;display:inline;vertical-align:middle;color:#2563eb;margin-right:6px;\">\u003C\u002Fi>\n    Convention Collective Transports Routiers (IDCC 16)\n  \u003C\u002Fh1>\n  \u003Cp class=\"subtitle\">Outil complet : salaire minimum, heures supplémentaires, ancienneté, indemnités\u003C\u002Fp>\n\n  \u003C!-- Tabs -->\n  \u003Cdiv class=\"tabs\">\n    \u003Cbutton class=\"tab-btn active\" data-tab=\"salaire\">Salaire minimal\u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"heures\">Heures supplémentaires\u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"anciennete\">Ancienneté\u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"frais\">Frais de déplacement\u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"repos\">Repos &amp; Durée du travail\u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"grille\">Grille des salaires\u003C\u002Fbutton>\n  \u003C\u002Fdiv>\n\n  \u003C!-- =========================================\n       TAB 1 : SALAIRE MINIMAL\n  ========================================= -->\n  \u003Cdiv id=\"tab-salaire\" class=\"tab-panel active\">\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"euro\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Paramètres du salarié\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"two-col\">\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Clabel>Catégorie professionnelle\u003C\u002Flabel>\n            \u003Cdiv style=\"height:8px;\">\u003C\u002Fdiv>\n            \u003Cselect id=\"sal-categorie\">\n              \u003Coptgroup label=\"Ouvriers\">\n                \u003Coption value=\"M105\">M105 – Ouvrier 1 (Manœuvre spécialisé)\u003C\u002Foption>\n                \u003Coption value=\"M110\">M110 – Ouvrier 2 (Manutentionnaire)\u003C\u002Foption>\n                \u003Coption value=\"M115\">M115 – Ouvrier 3 (Conducteur VL\u002FPL 2ème année)\u003C\u002Foption>\n                \u003Coption value=\"M120\">M120 – Ouvrier 4 (Conducteur PL expérimenté)\u003C\u002Foption>\n                \u003Coption value=\"M125\">M125 – Ouvrier 5 (Conducteur SPL)\u003C\u002Foption>\n                \u003Coption value=\"M130\" selected>M130 – Ouvrier 6 (Grand routier SPL)\u003C\u002Foption>\n              \u003C\u002Foptgroup>\n              \u003Coptgroup label=\"Employés\">\n                \u003Coption value=\"E100\">E100 – Employé 1\u003C\u002Foption>\n                \u003Coption value=\"E105\">E105 – Employé 2\u003C\u002Foption>\n                \u003Coption value=\"E110\">E110 – Employé 3\u003C\u002Foption>\n                \u003Coption value=\"E115\">E115 – Employé 4\u003C\u002Foption>\n                \u003Coption value=\"E120\">E120 – Employé 5\u003C\u002Foption>\n              \u003C\u002Foptgroup>\n              \u003Coptgroup label=\"Techniciens & Agents de Maîtrise\">\n                \u003Coption value=\"T100\">T100 – TAM 1\u003C\u002Foption>\n                \u003Coption value=\"T105\">T105 – TAM 2\u003C\u002Foption>\n                \u003Coption value=\"T110\">T110 – TAM 3\u003C\u002Foption>\n                \u003Coption value=\"T115\">T115 – TAM 4\u003C\u002Foption>\n              \u003C\u002Foptgroup>\n              \u003Coptgroup label=\"Cadres\">\n                \u003Coption value=\"C100\">C100 – Cadre 1\u003C\u002Foption>\n                \u003Coption value=\"C105\">C105 – Cadre 2\u003C\u002Foption>\n                \u003Coption value=\"C110\">C110 – Cadre 3\u003C\u002Foption>\n              \u003C\u002Foptgroup>\n            \u003C\u002Fselect>\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Heures travaillées par mois\u003C\u002Flabel>\n              \u003Cspan id=\"heures-display\" class=\"field-value\">169 h\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"sal-heures\" min=\"100\" max=\"220\" step=\"1\" value=\"169\">\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\">\n            \u003Clabel>Ancienneté dans l'entreprise\u003C\u002Flabel>\n            \u003Cdiv style=\"height:6px;\">\u003C\u002Fdiv>\n            \u003Cdiv class=\"pills\" id=\"anciennete-pills\">\n              \u003Cbutton class=\"pill active\" data-value=\"0\">0–2 ans\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"3\">3–5 ans\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"6\">6–9 ans\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"10\">10–14 ans\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"15\">15+ ans\u003C\u002Fbutton>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"calculator\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Résultat – Salaire minimum conventionnel\u003C\u002Fdiv>\n      \u003Cdiv class=\"results-grid\">\n        \u003Cdiv class=\"result-card\">\n          \u003Cp class=\"result-label\">Salaire de base (taux horaire)\u003C\u002Fp>\n          \u003Cp class=\"result-value blue\" id=\"res-taux-horaire\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">€ \u002F heure\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card success\">\n          \u003Cp class=\"result-label\">Salaire mensuel brut minimum\u003C\u002Fp>\n          \u003Cp class=\"result-value green\" id=\"res-salaire-mensuel\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">avant heures supplémentaires\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card\">\n          \u003Cp class=\"result-label\">Prime d'ancienneté\u003C\u002Fp>\n          \u003Cp class=\"result-value\" id=\"res-prime-anciennete\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">€ \u002F mois\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card neutral\">\n          \u003Cp class=\"result-label\">Total mensuel brut estimé\u003C\u002Fp>\n          \u003Cp class=\"result-value\" id=\"res-total-mensuel\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">base + ancienneté\u003C\u002Fp>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Ctable class=\"breakdown\">\n        \u003Cthead>\u003Ctr>\u003Cth>Composante\u003C\u002Fth>\u003Cth>Détail\u003C\u002Fth>\u003Cth class=\"amount\">Montant\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\n        \u003Ctbody id=\"sal-breakdown\">\u003C\u002Ftbody>\n      \u003C\u002Ftable>\n\n      \u003Cdiv class=\"info-box blue\" style=\"margin-top:14px;\">\n        \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;\">\u003C\u002Fi>\n        \u003Cspan>Les taux sont basés sur la grille nationale IDCC 16, avenant salaires 2025–2026. Vérifiez toujours la dernière NAO (Négociation Annuelle Obligatoire) applicable à votre entreprise.\u003C\u002Fspan>\n      \u003C\u002Fdiv>\n      \u003Cp class=\"source-note\">Source : Convention collective nationale des transports routiers (IDCC 16) – Arrêté d'extension 2025\u003C\u002Fp>\n    \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003C!-- =========================================\n       TAB 2 : HEURES SUPPLÉMENTAIRES\n  ========================================= -->\n  \u003Cdiv id=\"tab-heures\" class=\"tab-panel\">\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"clock\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Calcul des heures supplémentaires\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"two-col\">\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Taux horaire brut (€)\u003C\u002Flabel>\n            \u003C\u002Fdiv>\n            \u003Cdiv class=\"input-group\">\n              \u003Cinput type=\"number\" id=\"hs-taux\" value=\"12.50\" step=\"0.01\" min=\"11.88\">\n              \u003Cspan class=\"suffix\">€\u002Fh\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cp class=\"helper\">Saisir le taux horaire réel du salarié (min. SMIC 2026 : 11,88 €)\u003C\u002Fp>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Heures normales (hebdo)\u003C\u002Flabel>\n              \u003Cspan id=\"hs-normales-display\" class=\"field-value\">35 h\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"hs-normales\" min=\"35\" max=\"40\" step=\"1\" value=\"35\">\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Heures sup. tranche 1 (36–43h)\u003C\u002Flabel>\n              \u003Cspan id=\"hs-t1-display\" class=\"field-value\">0 h\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"hs-t1\" min=\"0\" max=\"8\" step=\"1\" value=\"0\">\n            \u003Cp class=\"helper\">Majorées à 25 % (IDCC 16)\u003C\u002Fp>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Heures sup. tranche 2 (au-delà 43h)\u003C\u002Flabel>\n              \u003Cspan id=\"hs-t2-display\" class=\"field-value\">0 h\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"hs-t2\" min=\"0\" max=\"20\" step=\"1\" value=\"0\">\n            \u003Cp class=\"helper\">Majorées à 50 % (IDCC 16)\u003C\u002Fp>\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"trending-up\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Décompte hebdomadaire\u003C\u002Fdiv>\n      \u003Cdiv class=\"results-grid\">\n        \u003Cdiv class=\"result-card\">\n          \u003Cp class=\"result-label\">Salaire heures normales\u003C\u002Fp>\n          \u003Cp class=\"result-value blue\" id=\"hs-res-normal\">–\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card\">\n          \u003Cp class=\"result-label\">Majoration tranche 1 (+25%)\u003C\u002Fp>\n          \u003Cp class=\"result-value orange\" id=\"hs-res-t1\">–\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card warning\">\n          \u003Cp class=\"result-label\">Majoration tranche 2 (+50%)\u003C\u002Fp>\n          \u003Cp class=\"result-value orange\" id=\"hs-res-t2\">–\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card success\">\n          \u003Cp class=\"result-label\">Total brut de la semaine\u003C\u002Fp>\n          \u003Cp class=\"result-value green\" id=\"hs-res-total\">–\u003C\u002Fp>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Ctable class=\"breakdown\" id=\"hs-breakdown-table\">\n        \u003Cthead>\u003Ctr>\u003Cth>Composante\u003C\u002Fth>\u003Cth>H × Taux × Majoration\u003C\u002Fth>\u003Cth class=\"amount\">Montant\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\n        \u003Ctbody id=\"hs-breakdown\">\u003C\u002Ftbody>\n      \u003C\u002Ftable>\n\n      \u003Cdiv class=\"info-box orange\" style=\"margin-top:14px;\">\n        \u003Ci data-lucide=\"alert-triangle\" style=\"width:16px;height:16px;\">\u003C\u002Fi>\n        \u003Cspan>\u003Cstrong>Contingent annuel IDCC 16 :\u003C\u002Fstrong> 220 h supplémentaires par an. Au-delà, les heures doivent être accordées sous forme de repos compensateur obligatoire (RCO) à 100 %, sauf accord d'entreprise.\u003C\u002Fspan>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003C!-- =========================================\n       TAB 3 : ANCIENNETÉ\n  ========================================= -->\n  \u003Cdiv id=\"tab-anciennete\" class=\"tab-panel\">\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"award\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Prime d'ancienneté IDCC 16\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"two-col\">\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Salaire de base mensuel brut (€)\u003C\u002Flabel>\n            \u003C\u002Fdiv>\n            \u003Cdiv class=\"input-group\">\n              \u003Cinput type=\"number\" id=\"anc-salaire\" value=\"2100\" step=\"10\" min=\"1800\">\n              \u003Cspan class=\"suffix\">€\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Années d'ancienneté dans l'entreprise\u003C\u002Flabel>\n              \u003Cspan id=\"anc-annees-display\" class=\"field-value\">5 ans\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"anc-annees\" min=\"0\" max=\"30\" step=\"1\" value=\"5\">\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Clabel>Type de contrat\u003C\u002Flabel>\n            \u003Cdiv style=\"height:6px;\">\u003C\u002Fdiv>\n            \u003Cdiv class=\"pills\" id=\"anc-contrat-pills\">\n              \u003Cbutton class=\"pill active\" data-value=\"cdi\">CDI\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"cdd\">CDD\u003C\u002Fbutton>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\" style=\"margin-top:12px;\">\n            \u003Clabel>Catégorie\u003C\u002Flabel>\n            \u003Cdiv style=\"height:6px;\">\u003C\u002Fdiv>\n            \u003Cdiv class=\"pills\" id=\"anc-cat-pills\">\n              \u003Cbutton class=\"pill active\" data-value=\"ouvrier\">Ouvrier\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"employe\">Employé\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"tam\">TAM\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"cadre\">Cadre\u003C\u002Fbutton>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"trending-up\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Prime d'ancienneté calculée\u003C\u002Fdiv>\n      \u003Cdiv class=\"results-grid\">\n        \u003Cdiv class=\"result-card\">\n          \u003Cp class=\"result-label\">Taux d'ancienneté applicable\u003C\u002Fp>\n          \u003Cp class=\"result-value blue\" id=\"anc-res-taux\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">% du salaire de base\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card success\">\n          \u003Cp class=\"result-label\">Prime d'ancienneté mensuelle\u003C\u002Fp>\n          \u003Cp class=\"result-value green\" id=\"anc-res-prime\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">brut \u002F mois\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card neutral\">\n          \u003Cp class=\"result-label\">Salaire total avec ancienneté\u003C\u002Fp>\n          \u003Cp class=\"result-value\" id=\"anc-res-total\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">brut \u002F mois\u003C\u002Fp>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"section-header\" style=\"margin-top:16px;\">Barème d'ancienneté IDCC 16 (ouvriers\u002Femployés)\u003C\u002Fdiv>\n      \u003Ctable class=\"salary-table\" id=\"anc-bareme-table\">\n        \u003Cthead>\u003Ctr>\u003Cth>Ancienneté\u003C\u002Fth>\u003Cth>Taux de majoration\u003C\u002Fth>\u003Cth>Prime (sur votre salaire)\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\n        \u003Ctbody id=\"anc-bareme\">\u003C\u002Ftbody>\n      \u003C\u002Ftable>\n\n      \u003Cdiv class=\"info-box green\" style=\"margin-top:14px;\">\n        \u003Ci data-lucide=\"check-circle\" style=\"width:16px;height:16px;\">\u003C\u002Fi>\n        \u003Cspan>La prime d'ancienneté IDCC 16 est calculée sur le salaire minimum conventionnel (et non le salaire réel si celui-ci est supérieur). Elle est cumulable avec les autres primes prévues par l'entreprise.\u003C\u002Fspan>\n      \u003C\u002Fdiv>\n      \u003Cp class=\"source-note\">Source : Art. 7 Annexe I CCNTR (ouvriers) – IDCC 16\u003C\u002Fp>\n    \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003C!-- =========================================\n       TAB 4 : FRAIS DE DÉPLACEMENT\n  ========================================= -->\n  \u003Cdiv id=\"tab-frais\" class=\"tab-panel\">\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"map-pin\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Indemnités de déplacement &amp; repas\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"two-col\">\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Clabel>Type de déplacement\u003C\u002Flabel>\n            \u003Cdiv style=\"height:6px;\">\u003C\u002Fdiv>\n            \u003Cdiv class=\"pills\" id=\"frais-type-pills\">\n              \u003Cbutton class=\"pill active\" data-value=\"courte\">Courte distance\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"longue\">Longue distance\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"international\">International\u003C\u002Fbutton>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Nombre de jours (dans le mois)\u003C\u002Flabel>\n              \u003Cspan id=\"frais-jours-display\" class=\"field-value\">20 j\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"frais-jours\" min=\"1\" max=\"26\" step=\"1\" value=\"20\">\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Clabel>Repas pris (par jour)\u003C\u002Flabel>\n            \u003Cdiv style=\"height:6px;\">\u003C\u002Fdiv>\n            \u003Cdiv class=\"pills\" id=\"frais-repas-pills\">\n              \u003Cbutton class=\"pill active\" data-value=\"1\">1 repas\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"2\">2 repas\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"3\">Petit-déj + 2 repas\u003C\u002Fbutton>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\" style=\"margin-top:12px;\">\n            \u003Cdiv class=\"toggle-group\">\n              \u003Clabel>Découché (nuit hors domicile)\u003C\u002Flabel>\n              \u003Clabel class=\"toggle\">\n                \u003Cinput type=\"checkbox\" id=\"frais-decouch\">\n                \u003Cspan class=\"toggle-slider\">\u003C\u002Fspan>\n              \u003C\u002Flabel>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\" id=\"frais-nuits-field\" style=\"display:none;\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Nuits en dehors du domicile\u003C\u002Flabel>\n              \u003Cspan id=\"frais-nuits-display\" class=\"field-value\">5 nuits\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"frais-nuits\" min=\"1\" max=\"20\" step=\"1\" value=\"5\">\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"receipt\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Total des indemnités\u003C\u002Fdiv>\n      \u003Cdiv class=\"results-grid\">\n        \u003Cdiv class=\"result-card\">\n          \u003Cp class=\"result-label\">Indemnités repas\u003C\u002Fp>\n          \u003Cp class=\"result-value blue\" id=\"frais-res-repas\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">€ \u002F mois\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card\">\n          \u003Cp class=\"result-label\">Indemnité découché\u003C\u002Fp>\n          \u003Cp class=\"result-value\" id=\"frais-res-decouch\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">€ \u002F mois\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card success\">\n          \u003Cp class=\"result-label\">Total indemnités mensuelles\u003C\u002Fp>\n          \u003Cp class=\"result-value green\" id=\"frais-res-total\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">exonérées de cotisations sociales\u003C\u002Fp>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"result-card neutral\">\n          \u003Cp class=\"result-label\">Taux journalier moyen\u003C\u002Fp>\n          \u003Cp class=\"result-value\" id=\"frais-res-journalier\">–\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">€ \u002F jour travaillé\u003C\u002Fp>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"section-header\" style=\"margin-top:16px;\">Barème IDCC 16 (tarifs 2025–2026)\u003C\u002Fdiv>\n      \u003Ctable class=\"breakdown\">\n        \u003Cthead>\u003Ctr>\u003Cth>Type d'indemnité\u003C\u002Fth>\u003Cth>Référence\u003C\u002Fth>\u003Cth class=\"amount\">Tarif unitaire\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\n        \u003Ctbody id=\"frais-bareme\">\u003C\u002Ftbody>\n      \u003C\u002Ftable>\n\n      \u003Cdiv class=\"info-box orange\" style=\"margin-top:14px;\">\n        \u003Ci data-lucide=\"alert-triangle\" style=\"width:16px;height:16px;\">\u003C\u002Fi>\n        \u003Cspan>Ces indemnités sont exonérées de charges sociales dans les limites URSSAF. Au-delà des plafonds conventionnels, la fraction excédentaire peut être soumise à cotisations. Vérifiez auprès de votre gestionnaire de paie.\u003C\u002Fspan>\n      \u003C\u002Fdiv>\n      \u003Cp class=\"source-note\">Source : Annexe I CCNTR – Barème indemnités de déplacement 2025–2026\u003C\u002Fp>\n    \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003C!-- =========================================\n       TAB 5 : REPOS & DURÉE DU TRAVAIL\n  ========================================= -->\n  \u003Cdiv id=\"tab-repos\" class=\"tab-panel\">\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"moon\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Règles de repos – Conduite routière (IDCC 16)\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"two-col\">\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Clabel>Type de transport\u003C\u002Flabel>\n            \u003Cdiv style=\"height:6px;\">\u003C\u002Fdiv>\n            \u003Cdiv class=\"pills\" id=\"repos-type-pills\">\n              \u003Cbutton class=\"pill active\" data-value=\"national\">National\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"regional\">Régional\u002FCourte dist.\u003C\u002Fbutton>\n              \u003Cbutton class=\"pill\" data-value=\"international\">International\u003C\u002Fbutton>\n            \u003C\u002Fdiv>\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Temps de conduite journalier (h)\u003C\u002Flabel>\n              \u003Cspan id=\"repos-conduite-display\" class=\"field-value\">8 h\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"repos-conduite\" min=\"1\" max=\"11\" step=\"0.5\" value=\"8\">\n            \u003Cp class=\"helper\">Max légal : 9 h\u002Fjour (10 h max 2×\u002Fsemaine)\u003C\u002Fp>\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Jours consécutifs travaillés\u003C\u002Flabel>\n              \u003Cspan id=\"repos-jours-display\" class=\"field-value\">5 j\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"repos-jours\" min=\"1\" max=\"12\" step=\"1\" value=\"5\">\n          \u003C\u002Fdiv>\n          \u003Cdiv class=\"field\">\n            \u003Cdiv class=\"field-header\">\n              \u003Clabel>Durée de conduite hebdo (h)\u003C\u002Flabel>\n              \u003Cspan id=\"repos-hebdo-display\" class=\"field-value\">40 h\u003C\u002Fspan>\n            \u003C\u002Fdiv>\n            \u003Cinput type=\"range\" id=\"repos-hebdo\" min=\"10\" max=\"60\" step=\"1\" value=\"40\">\n            \u003Cp class=\"helper\">Max légal : 56 h\u002Fsemaine, 90 h sur 2 semaines\u003C\u002Fp>\n          \u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"shield\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Conformité réglementaire\u003C\u002Fdiv>\n\n      \u003Cdiv id=\"repos-conformite\" class=\"results-grid\">\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"section-header\" style=\"margin-top:16px;\">Règles impératives IDCC 16 + Règlement CE 561\u002F2006\u003C\u002Fdiv>\n      \u003Ctable class=\"breakdown\">\n        \u003Cthead>\u003Ctr>\u003Cth>Règle\u003C\u002Fth>\u003Cth>Valeur légale\u003C\u002Fth>\u003Cth class=\"amount\">Votre situation\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\n        \u003Ctbody id=\"repos-tableau\">\u003C\u002Ftbody>\n      \u003C\u002Ftable>\n\n      \u003Cdiv class=\"info-box blue\" style=\"margin-top:14px;\">\n        \u003Ci data-lucide=\"book-open\" style=\"width:16px;height:16px;\">\u003C\u002Fi>\n        \u003Cspan>\u003Cstrong>Rappel IDCC 16 :\u003C\u002Fstrong> Le repos hebdomadaire normal est de 45 h. Le repos réduit (24 h minimum) est possible mais doit être compensé dans les 3 semaines. Le repos journalier minimum est de 11 h consécutives (ou 3 périodes fractionnées).\u003C\u002Fspan>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003C!-- =========================================\n       TAB 6 : GRILLE DES SALAIRES\n  ========================================= -->\n  \u003Cdiv id=\"tab-grille\" class=\"tab-panel\">\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"table\" style=\"width:18px;height:18px;\">\u003C\u002Fi> Grille nationale des salaires IDCC 16 (2026)\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Clabel>Filtrer par famille\u003C\u002Flabel>\n        \u003Cdiv style=\"height:6px;\">\u003C\u002Fdiv>\n        \u003Cdiv class=\"pills\" id=\"grille-filter-pills\">\n          \u003Cbutton class=\"pill active\" data-value=\"all\">Toutes\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-value=\"ouvrier\">Ouvriers\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-value=\"employe\">Employés\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-value=\"tam\">TAM\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-value=\"cadre\">Cadres\u003C\u002Fbutton>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv style=\"margin-top:16px; overflow-x:auto;\">\n        \u003Ctable class=\"salary-table\" id=\"grille-table\">\n          \u003Cthead>\n            \u003Ctr>\n              \u003Cth>Code\u003C\u002Fth>\n              \u003Cth>Intitulé\u003C\u002Fth>\n              \u003Cth>Famille\u003C\u002Fth>\n              \u003Cth>Taux horaire min.\u003C\u002Fth>\n              \u003Cth>Mensuel min. (169h)\u003C\u002Fth>\n            \u003C\u002Ftr>\n          \u003C\u002Fthead>\n          \u003Ctbody id=\"grille-tbody\">\u003C\u002Ftbody>\n        \u003C\u002Ftable>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"info-box blue\" style=\"margin-top:14px;\">\n        \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;\">\u003C\u002Fi>\n        \u003Cspan>Ces salaires minimaux sont les planchers conventionnels 2026. Aucun salarié ne peut être rémunéré en deçà. Le SMIC 2026 (11,88 €\u002Fh) s'applique si le minimum conventionnel lui est inférieur.\u003C\u002Fspan>\n      \u003C\u002Fdiv>\n      \u003Cp class=\"source-note\">Source : Barème des salaires minima IDCC 16 – NAO 2025–2026 (valeurs approximatives 2026)\u003C\u002Fp>\n    \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003Cscript>\n    \u002F\u002F ================================================\n    \u002F\u002F DATA – Grille salariale IDCC 16 (approx. 2026)\n    \u002F\u002F Basé sur les avenants salaires CCNTR 2025-2026\n    \u002F\u002F ================================================\n    const GRILLE = [\n      \u002F\u002F Ouvriers\n      { code: \"M105\", label: \"Ouvrier 1 – Manœuvre spécialisé\",         famille: \"ouvrier\", tauxHoraire: 11.95 },\n      { code: \"M110\", label: \"Ouvrier 2 – Manutentionnaire\",             famille: \"ouvrier\", tauxHoraire: 12.05 },\n      { code: \"M115\", label: \"Ouvrier 3 – Conducteur VL \u002F PL 1ère cat.\", famille: \"ouvrier\", tauxHoraire: 12.20 },\n      { code: \"M120\", label: \"Ouvrier 4 – Conducteur PL expérimenté\",    famille: \"ouvrier\", tauxHoraire: 12.50 },\n      { code: \"M125\", label: \"Ouvrier 5 – Conducteur SPL\",               famille: \"ouvrier\", tauxHoraire: 12.85 },\n      { code: \"M130\", label: \"Ouvrier 6 – Grand routier SPL\",            famille: \"ouvrier\", tauxHoraire: 13.20 },\n      \u002F\u002F Employés\n      { code: \"E100\", label: \"Employé 1\",                                famille: \"employe\", tauxHoraire: 11.95 },\n      { code: \"E105\", label: \"Employé 2\",                                famille: \"employe\", tauxHoraire: 12.15 },\n      { code: \"E110\", label: \"Employé 3\",                                famille: \"employe\", tauxHoraire: 12.50 },\n      { code: \"E115\", label: \"Employé 4\",                                famille: \"employe\", tauxHoraire: 12.90 },\n      { code: \"E120\", label: \"Employé 5\",                                famille: \"employe\", tauxHoraire: 13.35 },\n      \u002F\u002F TAM\n      { code: \"T100\", label: \"TAM 1\",                                    famille: \"tam\",     tauxHoraire: 14.00 },\n      { code: \"T105\", label: \"TAM 2\",                                    famille: \"tam\",     tauxHoraire: 15.20 },\n      { code: \"T110\", label: \"TAM 3\",                                    famille: \"tam\",     tauxHoraire: 17.00 },\n      { code: \"T115\", label: \"TAM 4\",                                    famille: \"tam\",     tauxHoraire: 19.50 },\n      \u002F\u002F Cadres\n      { code: \"C100\", label: \"Cadre 1\",                                  famille: \"cadre\",   tauxHoraire: 22.00 },\n      { code: \"C105\", label: \"Cadre 2\",                                  famille: \"cadre\",   tauxHoraire: 26.50 },\n      { code: \"C110\", label: \"Cadre 3\",                                  famille: \"cadre\",   tauxHoraire: 33.00 },\n    ];\n\n    \u002F\u002F Barème ancienneté IDCC 16 – ouvriers\u002Femployés (Art. 7 Annexe I)\n    const BAREME_ANC_OE = [\n      { min: 0,  max: 2,  taux: 0,   label: \"0 à 2 ans\" },\n      { min: 3,  max: 5,  taux: 3,   label: \"3 à 5 ans\" },\n      { min: 6,  max: 9,  taux: 6,   label: \"6 à 9 ans\" },\n      { min: 10, max: 14, taux: 9,   label: \"10 à 14 ans\" },\n      { min: 15, max: 19, taux: 12,  label: \"15 à 19 ans\" },\n      { min: 20, max: 99, taux: 15,  label: \"20 ans et +\" },\n    ];\n    const BAREME_ANC_TAM = [\n      { min: 0,  max: 2,  taux: 0,   label: \"0 à 2 ans\" },\n      { min: 3,  max: 5,  taux: 4,   label: \"3 à 5 ans\" },\n      { min: 6,  max: 9,  taux: 8,   label: \"6 à 9 ans\" },\n      { min: 10, max: 14, taux: 12,  label: \"10 à 14 ans\" },\n      { min: 15, max: 99, taux: 15,  label: \"15 ans et +\" },\n    ];\n    const BAREME_ANC_CADRE = [\n      { min: 0,  max: 2,  taux: 0,   label: \"0 à 2 ans\" },\n      { min: 3,  max: 5,  taux: 5,   label: \"3 à 5 ans\" },\n      { min: 6,  max: 9,  taux: 10,  label: \"6 à 9 ans\" },\n      { min: 10, max: 99, taux: 15,  label: \"10 ans et +\" },\n    ];\n\n    \u002F\u002F Indemnités repas\u002Fdéplacement IDCC 16 (tarifs indicatifs 2025-2026, €)\n    const INDEM_REPAS = {\n      courte:        { petit_dej: 3.65, repas: 10.15, decouch: 0 },\n      longue:        { petit_dej: 4.10, repas: 11.40, decouch: 24.60 },\n      international: { petit_dej: 4.50, repas: 14.30, decouch: 31.50 },\n    };\n\n    \u002F\u002F ================================================\n    \u002F\u002F HELPERS\n    \u002F\u002F ================================================\n    const fmtEur = (n) => new Intl.NumberFormat('fr-FR', { maximumFractionDigits: 2, minimumFractionDigits: 2 }).format(n) + ' €';\n    const fmtEur0 = (n) => new Intl.NumberFormat('fr-FR', { maximumFractionDigits: 0 }).format(n) + ' €';\n\n    \u002F\u002F Pill group helper\n    function bindPills(groupId, onChange) {\n      const container = document.getElementById(groupId);\n      if (!container) return;\n      container.addEventListener('click', (e) => {\n        const btn = e.target.closest('.pill');\n        if (!btn) return;\n        container.querySelectorAll('.pill').forEach(b => b.classList.remove('active'));\n        btn.classList.add('active');\n        onChange(btn.dataset.value);\n      });\n    }\n\n    function getActivePill(groupId) {\n      const el = document.querySelector(`#${groupId} .pill.active`);\n      return el ? el.dataset.value : null;\n    }\n\n    \u002F\u002F ================================================\n    \u002F\u002F TAB LOGIC\n    \u002F\u002F ================================================\n    document.querySelectorAll('.tab-btn').forEach(btn => {\n      btn.addEventListener('click', () => {\n        document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));\n        document.querySelectorAll('.tab-panel').forEach(p => p.classList.remove('active'));\n        btn.classList.add('active');\n        document.getElementById('tab-' + btn.dataset.tab).classList.add('active');\n        if (window.lucide) lucide.createIcons();\n        parent.postMessage({ type: 'resize', height: document.body.scrollHeight + 32 }, '*');\n      });\n    });\n\n    \u002F\u002F ================================================\n    \u002F\u002F TAB 1 – SALAIRE\n    \u002F\u002F ================================================\n    const salState = { categorie: 'M130', heures: 169, ancienneteBucket: 0 };\n\n    function getSalData() {\n      const row = GRILLE.find(g => g.code === salState.categorie) || GRILLE[5];\n      const tauxHoraire = row.tauxHoraire;\n      const base = tauxHoraire * salState.heures;\n\n      \u002F\u002F Ancienneté sur base salaire\n      let ancTaux = salState.ancienneteBucket >= 15 ? 15\n                  : salState.ancienneteBucket >= 10 ? 9\n                  : salState.ancienneteBucket >= 6  ? 6\n                  : salState.ancienneteBucket >= 3  ? 3\n                  : 0;\n      const prime = base * (ancTaux \u002F 100);\n      const total = base + prime;\n\n      return { tauxHoraire, base, ancTaux, prime, total, row };\n    }\n\n    function renderSalaire() {\n      const d = getSalData();\n      document.getElementById('res-taux-horaire').textContent = fmtEur(d.tauxHoraire);\n      document.getElementById('res-salaire-mensuel').textContent = fmtEur0(d.base);\n      document.getElementById('res-prime-anciennete').textContent = fmtEur0(d.prime);\n      document.getElementById('res-total-mensuel').textContent = fmtEur0(d.total);\n\n      const tbody = document.getElementById('sal-breakdown');\n      tbody.innerHTML = `\n        \u003Ctr>\u003Ctd class=\"label\">Taux horaire conventionnel (${d.row.code})\u003C\u002Ftd>\u003Ctd>${fmtEur(d.tauxHoraire)} × ${salState.heures} h\u003C\u002Ftd>\u003Ctd class=\"amount\">${fmtEur0(d.base)}\u003C\u002Ftd>\u003C\u002Ftr>\n        \u003Ctr>\u003Ctd class=\"label\">Prime d'ancienneté (+${d.ancTaux}%)\u003C\u002Ftd>\u003Ctd>${d.ancTaux}% × ${fmtEur0(d.base)}\u003C\u002Ftd>\u003Ctd class=\"amount\">${fmtEur0(d.prime)}\u003C\u002Ftd>\u003C\u002Ftr>\n        \u003Ctr class=\"total\">\u003Ctd class=\"label\">Total mensuel brut estimé\u003C\u002Ftd>\u003Ctd>\u003C\u002Ftd>\u003Ctd class=\"amount\">${fmtEur0(d.total)}\u003C\u002Ftd>\u003C\u002Ftr>\n      `;\n      if (window.lucide) lucide.createIcons();\n    }\n\n    document.getElementById('sal-categorie').addEventListener('change', (e) => {\n      salState.categorie = e.target.value;\n      renderSalaire();\n    });\n\n    const salHeuresInput = document.getElementById('sal-heures');\n    salHeuresInput.addEventListener('input', (e) => {\n      salState.heures = Number(e.target.value);\n      document.getElementById('heures-display').textContent = salState.heures + ' h';\n      renderSalaire();\n    });\n\n    bindPills('anciennete-pills', (val) => {\n      salState.ancienneteBucket = Number(val);\n      renderSalaire();\n    });\n\n    renderSalaire();\n\n    \u002F\u002F ================================================\n    \u002F\u002F TAB 2 – HEURES SUPPLÉMENTAIRES\n    \u002F\u002F ================================================\n    const hsState = { taux: 12.50, normales: 35, t1: 0, t2: 0 };\n\n    function renderHS() {\n      const normal = hsState.taux * hsState.normales;\n      const majT1   = hsState.taux * 1.25 * hsState.t1;\n      const majT2   = hsState.taux * 1.50 * hsState.t2;\n      const total   = normal + majT1 + majT2;\n\n      document.getElementById('hs-res-normal').textContent  = fmtEur(normal);\n      document.getElementById('hs-res-t1').textContent      = fmtEur(majT1);\n      document.getElementById('hs-res-t2').textContent      = fmtEur(majT2);\n      document.getElementById('hs-res-total').textContent   = fmtEur(total);\n\n      const tbody = document.getElementById('hs-breakdown');\n      tbody.innerHTML = `\n        \u003Ctr>\u003Ctd class=\"label\">Heures normales (${hsState.normales} h)\u003C\u002Ftd>\u003Ctd>${hsState.normales} × ${fmtEur(hsState.taux)} × 1,00\u003C\u002Ftd>\u003Ctd class=\"amount\">${fmtEur(normal)}\u003C\u002Ftd>\u003C\u002Ftr>\n        \u003Ctr>\u003Ctd class=\"label\">Heures sup. tranche 1 (${hsState.t1} h)\u003C\u002Ftd>\u003Ctd>${hsState.t1} × ${fmtEur(hsState.taux)} × 1,25\u003C\u002Ftd>\u003Ctd class=\"amount\">${fmtEur(majT1)}\u003C\u002Ftd>\u003C\u002Ftr>\n        \u003Ctr>\u003Ctd class=\"label\">Heures sup. tranche 2 (${hsState.t2} h)\u003C\u002Ftd>\u003Ctd>${hsState.t2} × ${fmtEur(hsState.taux)} × 1,50\u003C\u002Ftd>\u003Ctd class=\"amount\">${fmtEur(majT2)}\u003C\u002Ftd>\u003C\u002Ftr>\n        \u003Ctr class=\"total\">\u003Ctd class=\"label\">Total brut hebdomadaire\u003C\u002Ftd>\u003Ctd>\u003C\u002Ftd>\u003Ctd class=\"amount\">${fmtEur(total)}\u003C\u002Ftd>\u003C\u002Ftr>\n      `;\n    }\n\n    document.getElementById('hs-taux').addEventListener('input', (e) => {\n      hsState.taux = Number(e.target.value) || 12.50;\n      renderHS();\n    });\n\n    [['hs-normales','hs-normales-display', 'h'], ['hs-t1','hs-t1-display', 'h'], ['hs-t2','hs-t2-display', 'h']].forEach(([id, dispId, suffix]) => {\n      const el = document.getElementById(id);\n      el.addEventListener('input', (e) => {\n        const v = Number(e.target.value);\n        document.getElementById(dispId).textContent = v + ' ' + suffix;\n        if (id === 'hs-normales') hsState.normales = v;\n        if (id === 'hs-t1') hsState.t1 = v;\n        if (id === 'hs-t2') hsState.t2 = v;\n        renderHS();\n      });\n    });\n\n    renderHS();\n\n    \u002F\u002F ================================================\n    \u002F\u002F TAB 3 – ANCIENNETÉ\n    \u002F\u002F ================================================\n    const ancState = { salaire: 2100, annees: 5, contrat: 'cdi', categorie: 'ouvrier' };\n\n    function getBaremeAnc() {\n      if (ancState.categorie === 'cadre') return BAREME_ANC_CADRE;\n      if (ancState.categorie === 'tam') return BAREME_ANC_TAM;\n      return BAREME_ANC_OE;\n    }\n\n    function renderAnciennete() {\n      const bareme = getBaremeAnc();\n      const row = bareme.find(r => ancState.annees >= r.min && ancState.annees \u003C= r.max) || bareme[0];\n      const prime = ancState.salaire * (row.taux \u002F 100);\n      const total = ancState.salaire + prime;\n\n      document.getElementById('anc-res-taux').textContent  = row.taux + ' %';\n      document.getElementById('anc-res-prime').textContent = fmtEur0(prime);\n      document.getElementById('anc-res-total').textContent = fmtEur0(total);\n\n      \u002F\u002F Bareme table\n      const tbody = document.getElementById('anc-bareme');\n      tbody.innerHTML = bareme.map(r => {\n        const isActive = ancState.annees >= r.min && ancState.annees \u003C= r.max;\n        const p = ancState.salaire * (r.taux \u002F 100);\n        return `\u003Ctr ${isActive ? 'class=\"highlighted\"' : ''}>\n          \u003Ctd>${r.label}${isActive ? ' \u003Cspan class=\"badge blue\">Votre situation\u003C\u002Fspan>' : ''}\u003C\u002Ftd>\n          \u003Ctd>+${r.taux}%\u003C\u002Ftd>\n          \u003Ctd>${fmtEur0(p)}\u003C\u002Ftd>\n        \u003C\u002Ftr>`;\n      }).join('');\n      if (window.lucide) lucide.createIcons();\n    }\n\n    document.getElementById('anc-salaire').addEventListener('input', (e) => {\n      ancState.salaire = Number(e.target.value) || 1800;\n      renderAnciennete();\n    });\n\n    document.getElementById('anc-annees').addEventListener('input', (e) => {\n      ancState.annees = Number(e.target.value);\n      document.getElementById('anc-annees-display').textContent = ancState.annees + ' an' + (ancState.annees > 1 ? 's' : '');\n      renderAnciennete();\n    });\n\n    bindPills('anc-contrat-pills', (v) => { ancState.contrat = v; renderAnciennete(); });\n    bindPills('anc-cat-pills', (v) => { ancState.categorie = v; renderAnciennete(); });\n\n    renderAnciennete();\n\n    \u002F\u002F ================================================\n    \u002F\u002F TAB 4 – FRAIS DE DÉPLACEMENT\n    \u002F\u002F ================================================\n    const fraisState = { type: 'courte', jours: 20, repas: 1, decouch: false, nuits: 5 };\n\n    function renderFrais() {\n      const tarifs = INDEM_REPAS[fraisState.type];\n      \u002F\u002F Repas : nombre par jour × tarif repas + petit-déjeuner si 3 repas\n      let repasParJour = 0;\n      if (fraisState.repas === 1) repasParJour = tarifs.repas;\n      else if (fraisState.repas === 2) repasParJour = tarifs.repas * 2;\n      else repasParJour = tarifs.petit_dej + tarifs.repas * 2;\n\n      const totalRepas  = repasParJour * fraisState.jours;\n      const totalDecouch = fraisState.decouch ? tarifs.decouch * fraisState.nuits : 0;\n      const totalMensuel = totalRepas + totalDecouch;\n      const journalier   = fraisState.jours > 0 ? totalMensuel \u002F fraisState.jours : 0;\n\n      document.getElementById('frais-res-repas').textContent     = fmtEur0(totalRepas);\n      document.getElementById('frais-res-decouch').textContent   = fmtEur0(totalDecouch);\n      document.getElementById('frais-res-total').textContent     = fmtEur0(totalMensuel);\n      document.getElementById('frais-res-journalier').textContent = fmtEur(journalier);\n\n      \u002F\u002F Barème\n      const tbody = document.getElementById('frais-bareme');\n      const rows = [\n        { label: 'Repas (déjeuner ou dîner)', ref: 'Art. 10bis Annexe I', tarif: fmtEur(tarifs.repas) },\n        { label: 'Petit-déjeuner', ref: 'Art. 10bis Annexe I', tarif: fmtEur(tarifs.petit_dej) },\n        ...(fraisState.type !== 'courte' ? [{ label: 'Indemnité de découché', ref: 'Art. 10ter Annexe I', tarif: fmtEur(tarifs.decouch) }] : []),\n      ];\n      tbody.innerHTML = rows.map(r =>\n        `\u003Ctr>\u003Ctd class=\"label\">${r.label}\u003C\u002Ftd>\u003Ctd>${r.ref}\u003C\u002Ftd>\u003Ctd class=\"amount\">${r.tarif}\u003C\u002Ftd>\u003C\u002Ftr>`\n      ).join('');\n    }\n\n    document.getElementById('frais-jours').addEventListener('input', (e) => {\n      fraisState.jours = Number(e.target.value);\n      document.getElementById('frais-jours-display').textContent = fraisState.jours + ' j';\n      renderFrais();\n    });\n\n    document.getElementById('frais-nuits').addEventListener('input', (e) => {\n      fraisState.nuits = Number(e.target.value);\n      document.getElementById('frais-nuits-display').textContent = fraisState.nuits + ' nuits';\n      renderFrais();\n    });\n\n    document.getElementById('frais-decouch').addEventListener('change', (e) => {\n      fraisState.decouch = e.target.checked;\n      document.getElementById('frais-nuits-field').style.display = fraisState.decouch ? 'block' : 'none';\n      renderFrais();\n    });\n\n    bindPills('frais-type-pills', (v) => { fraisState.type = v; renderFrais(); });\n    bindPills('frais-repas-pills', (v) => { fraisState.repas = Number(v); renderFrais(); });\n\n    renderFrais();\n\n    \u002F\u002F ================================================\n    \u002F\u002F TAB 5 – REPOS & DURÉE DU TRAVAIL\n    \u002F\u002F ================================================\n    const reposState = { type: 'national', conduite: 8, jours: 5, hebdo: 40 };\n\n    function renderRepos() {\n      const { conduite, jours, hebdo } = reposState;\n\n      \u002F\u002F Règles CE 561\u002F2006 + IDCC 16\n      const condJournMax = conduite > 10 ? 'danger' : conduite > 9 ? 'warning' : 'ok';\n      const joursConsMax = jours > 6 ? 'danger' : jours === 6 ? 'warning' : 'ok';\n      const hebdoMax = hebdo > 60 ? 'danger' : hebdo > 56 ? 'warning' : 'ok';\n\n      const cards = [\n        { label: 'Conduite journalière', value: conduite + ' h', ref: 'max 9 h (10 h 2×\u002Fsem)', status: condJournMax },\n        { label: 'Jours consécutifs', value: jours + ' j', ref: 'max 6 jours', status: joursConsMax },\n        { label: 'Conduite hebdomadaire', value: hebdo + ' h', ref: 'max 56 h\u002Fsem', status: hebdoMax },\n      ];\n\n      const grid = document.getElementById('repos-conformite');\n      grid.innerHTML = cards.map(c => {\n        const cls = c.status === 'ok' ? 'success' : c.status === 'warning' ? 'warning' : '';\n        const icon = c.status === 'ok' ? 'check-circle' : c.status === 'warning' ? 'alert-triangle' : 'x-circle';\n        const color = c.status === 'ok' ? 'green' : c.status === 'warning' ? 'orange' : 'orange';\n        return `\u003Cdiv class=\"result-card ${cls}\">\n          \u003Cp class=\"result-label\">\u003Ci data-lucide=\"${icon}\" style=\"width:14px;height:14px;display:inline;vertical-align:middle;\">\u003C\u002Fi> ${c.label}\u003C\u002Fp>\n          \u003Cp class=\"result-value ${color}\">${c.value}\u003C\u002Fp>\n          \u003Cp class=\"result-sub\">${c.ref}\u003C\u002Fp>\n        \u003C\u002Fdiv>`;\n      }).join('');\n\n      \u002F\u002F Tableau conformité\n      const tbody = document.getElementById('repos-tableau');\n      const reposJournMin = conduite > 9 ? '9 h (repos réduit autorisé)' : '11 h minimum';\n      const rows = [\n        { regle: 'Conduite journalière max.', legal: '9 h (10 h max 2×\u002Fsem.)', situation: conduite + ' h', ok: conduite \u003C= 10 },\n        { regle: 'Repos journalier minimum', legal: '11 h consécutives', situation: reposJournMin, ok: conduite \u003C= 9 },\n        { regle: 'Jours consécutifs max.', legal: '6 jours', situation: jours + ' jours', ok: jours \u003C= 6 },\n        { regle: 'Conduite hebdo max.', legal: '56 h\u002Fsemaine', situation: hebdo + ' h', ok: hebdo \u003C= 56 },\n        { regle: 'Conduite sur 2 semaines', legal: '90 h max', situation: (hebdo * 2) + ' h (estimé)', ok: hebdo * 2 \u003C= 90 },\n        { regle: 'Repos hebdomadaire normal', legal: '45 h (IDCC 16)', situation: '–', ok: true },\n        { regle: 'Pause conduite (4h30)', legal: '45 min (ou 15+30)', situation: '–', ok: true },\n      ];\n      tbody.innerHTML = rows.map(r =>\n        `\u003Ctr>\n          \u003Ctd class=\"label\">${r.regle}\u003C\u002Ftd>\n          \u003Ctd>${r.legal}\u003C\u002Ftd>\n          \u003Ctd class=\"amount\" style=\"color:${r.ok ? '#16a34a' : '#dc2626'}\">${r.situation}\u003C\u002Ftd>\n        \u003C\u002Ftr>`\n      ).join('');\n\n      if (window.lucide) lucide.createIcons();\n    }\n\n    [\n      ['repos-conduite', 'repos-conduite-display', 'h', 'conduite'],\n      ['repos-jours', 'repos-jours-display', 'j', 'jours'],\n      ['repos-hebdo', 'repos-hebdo-display', 'h', 'hebdo'],\n    ].forEach(([id, dispId, suffix, key]) => {\n      document.getElementById(id).addEventListener('input', (e) => {\n        reposState[key] = Number(e.target.value);\n        document.getElementById(dispId).textContent = reposState[key] + ' ' + suffix;\n        renderRepos();\n      });\n    });\n\n    bindPills('repos-type-pills', (v) => { reposState.type = v; renderRepos(); });\n    renderRepos();\n\n    \u002F\u002F ================================================\n    \u002F\u002F TAB 6 – GRILLE DES SALAIRES\n    \u002F\u002F ================================================\n    let grilleFilter = 'all';\n\n    function renderGrille() {\n      const tbody = document.getElementById('grille-tbody');\n      const filtered = grilleFilter === 'all' ? GRILLE : GRILLE.filter(g => g.famille === grilleFilter);\n      tbody.innerHTML = filtered.map(g => {\n        const mensuel = g.tauxHoraire * 169;\n        const famLabel = { ouvrier: 'Ouvrier', employe: 'Employé', tam: 'TAM', cadre: 'Cadre' }[g.famille] || g.famille;\n        return `\u003Ctr>\n          \u003Ctd>\u003Cspan class=\"badge blue\">${g.code}\u003C\u002Fspan>\u003C\u002Ftd>\n          \u003Ctd>${g.label}\u003C\u002Ftd>\n          \u003Ctd>${famLabel}\u003C\u002Ftd>\n          \u003Ctd class=\"amount\">${fmtEur(g.tauxHoraire)}\u003C\u002Ftd>\n          \u003Ctd class=\"amount\">${fmtEur0(mensuel)}\u003C\u002Ftd>\n        \u003C\u002Ftr>`;\n      }).join('');\n      if (window.lucide) lucide.createIcons();\n    }\n\n    bindPills('grille-filter-pills', (v) => { grilleFilter = v; renderGrille(); });\n    renderGrille();\n\n    \u002F\u002F ================================================\n    \u002F\u002F MANDATORY: Lucide icons init\n    \u002F\u002F ================================================\n    if (window.lucide) lucide.createIcons();\n\n    \u002F\u002F MANDATORY: Auto-resize for iframe\n    new ResizeObserver(() => {\n      parent.postMessage({ type: 'resize', height: document.body.scrollHeight + 32 }, '*');\n    }).observe(document.body);\n  \u003C\u002Fscript>\n\u003C\u002Fbody>\n\u003C\u002Fhtml>\n","generated","consumer","embed","https:\u002F\u002Fpub-bdebbd2dad294475a2da0eb657815b6b.r2.dev\u002Ftools\u002Foutil-idcc16-4213e50688.webp",[]]