[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"footer-root-categories-fr-FR":3,"tool-content-ccn-de-la-couture-parisienne-fr":83,"footer-cities-fr":146},[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":109,"tool_html":140,"source":141,"category":142,"audience":143,"publish_mode":144,"hero_image":145,"hero_image_alt":7},"ccn-de-la-couture-parisienne","CCN couture parisienne — calculateur complet","Calculateur CCN Couture Parisienne IDCC 303 | Expert Zoom","Outil interactif couvrant l'indemnité de licenciement, le préavis, la grille salariale 2025, le 13e mois, la prime d'ancienneté, les congés payés et les heures supplémentaires de la CCN couture parisienne (IDCC 303).","Ce calculateur couvre les 6 principales déviations de la convention collective de la couture parisienne (IDCC 303) par rapport au Code du travail : indemnité de licenciement (2\u002F5 mois au-delà de 10 ans), préavis progressif (jusqu'à 4 mois pour les cadres seniors), grille salariale 2025 en 9 groupes, 13e mois obligatoire et prime d'ancienneté jusqu'à 15 %, jours de congés supplémentaires selon l'ancienneté, et contingent d'heures supplémentaires de 160 heures par an.",[90],{"name":91,"@type":92,"about":93,"author":97,"@context":100,"isPartOf":101,"inLanguage":104,"description":105,"operatingSystem":106,"applicationCategory":107,"isAccessibleForFree":108},"Calculateur CCN Couture Parisienne — IDCC 303","WebApplication",{"name":94,"@type":95,"identifier":96},"Convention collective de la couture parisienne","Thing","IDCC 303",{"name":98,"@type":99},"Expert-Zoom","Organization","https:\u002F\u002Fschema.org",{"url":102,"@type":103},"\u002Ffr\u002Fmagazine\u002Fjuridique\u002Fles-conventions-collectives-en-france","Article","fr","Outil interactif couvrant l'indemnité de licenciement, le préavis, la grille salariale 2025, le 13e mois, la prime d'ancienneté, les congés payés et les heures supplémentaires de la convention collective de la couture parisienne (IDCC 303).","All","FinanceApplication",true,[110,113,116,119,122,125,128,131,134,137],{"a":111,"q":112},"La CCN IDCC 303 prévoit 1\u002F4 de mois de salaire par année d'ancienneté pour les 10 premières années, puis 2\u002F5 de mois par année supplémentaire au-delà de 10 ans — plus favorable que le Code du travail (1\u002F3 après 10 ans). Pour les salariés de 55 ans et plus justifiant d'au moins 10 ans d'ancienneté, une majoration de 15 % s'applique sur le montant total.","Comment calculer l'indemnité de licenciement dans la convention collective de la couture parisienne ?",{"a":114,"q":115},"Pour les non-cadres (groupes 1 à 5) : 1 semaine pour moins de 6 mois d'ancienneté, 1 mois de 6 mois à 2 ans, et 2 mois à partir de 2 ans. Pour les cadres (groupes 6 à 9) : 3 mois en règle générale, porté à 4 mois pour les cadres de 50 ans et plus justifiant d'au moins 10 ans d'ancienneté dans la catégorie cadre.","Quelle est la durée du préavis dans la couture parisienne ?",{"a":117,"q":118},"La CCN publie une grille de 9 groupes × 3 niveaux (A, B, C). Selon l'avenant du 7 février 2025 (en vigueur au 1er mai 2025), les minima mensuels bruts vont de 1 970 € (Groupe 1, Niveau A) à plus de 6 600 € (Groupe 9, Niveau C) pour 35 heures hebdomadaires.","Quels sont les salaires minimaux de la convention collective de la couture parisienne en 2025 ?",{"a":120,"q":121},"Oui, le 13e mois est obligatoire pour tous les salariés. Il est versé en deux fois : 50 % en juin et 50 % en décembre. Son montant équivaut à un mois de salaire brut de base.","La convention collective de la couture parisienne prévoit-elle un 13e mois ?",{"a":123,"q":124},"La prime d'ancienneté est une majoration progressive du salaire mensuel de base : 3 % à partir de 3 ans, 6 % à 6 ans, 9 % à 9 ans, 12 % à 12 ans, et 15 % (plafond) à partir de 15 ans d'ancienneté. Elle est versée deux fois par an (fin mars et fin septembre).","Qu'est-ce que la prime d'ancienneté dans la CCN couture parisienne ?",{"a":126,"q":127},"Oui, la CCN prévoit des jours supplémentaires selon l'ancienneté : +1 jour à 10 ans, +2 jours à 15 ans, +3 jours à 20 ans, +5 jours à 25 ans, et +6 jours à 30 ans d'ancienneté. De plus, le 25 novembre est reconnu comme jour férié propre à la couture parisienne.","Y a-t-il des congés payés supplémentaires dans la convention collective IDCC 303 ?",{"a":129,"q":130},"Le contingent annuel est de 160 heures (contre 220 heures dans le régime légal standard), ce qui est plus protecteur pour les salariés. Les taux de majoration sont les mêmes que la loi : +25 % pour les 8 premières heures supplémentaires hebdomadaires, puis +50 % au-delà.","Quel est le contingent d'heures supplémentaires dans la couture parisienne ?",{"a":132,"q":133},"Durant les 4 périodes de collection annuelles, le travail effectué sur le deuxième jour de repos hebdomadaire donne droit à une majoration de 50 % (8 heures maximum par collection). Ce régime s'applique aux maisons de couture présentant au moins 25 modèles sur mannequins vivants.","Quelles sont les règles spéciales pour les heures de collection dans la couture parisienne ?",{"a":135,"q":136},"Les durées varient selon le groupe : Groupes 1-3 : 2 mois non renouvelables ; Groupe 4 : 2 mois renouvelables 1 mois (max 3 mois) ; Groupe 5 : 2 mois renouvelables 2 mois (max 4 mois) ; Groupe 6 : 4 mois renouvelables 1 mois (max 5 mois) ; Groupes 7-9 : 4 mois renouvelables jusqu'à 8 mois.","Quelle est la durée de la période d'essai dans la CCN couture parisienne ?",{"a":138,"q":139},"Non, la convention collective de la couture parisienne s'applique principalement aux entreprises de haute couture, de couture-création et aux activités connexes situées dans la région parisienne. Elle couvre notamment les maisons de couture présentant des collections, les ateliers de confection haut de gamme et les métiers connexes (modélisme, stylisme, confection).","La CCN couture parisienne IDCC 303 s'applique-t-elle à toute la 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\">\n  \u003Ctitle>Calculateur CCN Couture Parisienne IDCC 303\u003C\u002Ftitle>\n  \u003Cscript src=\"https:\u002F\u002Funpkg.com\u002Flucide@latest\u002Fdist\u002Fumd\u002Flucide.min.js\">\u003C\u002Fscript>\n  \u003Cstyle>\n    \u002F* --- Design tokens --- *\u002F\n    :root {\n      --bg: #fafaf9;\n      --surface: #ffffff;\n      --border: #e7e5e4;\n      --accent: #2563eb;\n      --accent-light: #eff6ff;\n      --accent-dark: #1d4ed8;\n      --text: #1c1917;\n      --muted: #78716c;\n      --success: #16a34a;\n      --success-light: #f0fdf4;\n      --warning: #ca8a04;\n      --warning-light: #fefce8;\n      --radius: 0.75rem;\n      --radius-sm: 0.5rem;\n      --shadow: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px rgba(0,0,0,0.06);\n    }\n\n    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\n\n    body {\n      font-family: system-ui, -apple-system, sans-serif;\n      background: var(--bg);\n      color: var(--text);\n      font-size: 0.9375rem;\n      line-height: 1.5;\n    }\n\n    .tool-root {\n      max-width: 720px;\n      margin: 0 auto;\n      padding: 1.25rem 1rem 2rem;\n    }\n\n    \u002F* Header *\u002F\n    .tool-header {\n      display: flex;\n      align-items: flex-start;\n      justify-content: space-between;\n      gap: 1rem;\n      margin-bottom: 1.25rem;\n    }\n    .tool-title { font-size: 1.1rem; font-weight: 700; color: var(--text); }\n    .tool-subtitle { font-size: 0.8125rem; color: var(--muted); margin-top: 0.125rem; }\n    .idcc-badge {\n      flex-shrink: 0;\n      background: var(--accent-light);\n      color: var(--accent);\n      font-size: 0.75rem;\n      font-weight: 600;\n      padding: 0.25rem 0.625rem;\n      border-radius: 9999px;\n      border: 1px solid #bfdbfe;\n      white-space: nowrap;\n    }\n\n    \u002F* Tabs *\u002F\n    .tabs-nav {\n      display: flex;\n      gap: 0.25rem;\n      border-bottom: 2px solid var(--border);\n      margin-bottom: 1.25rem;\n      overflow-x: auto;\n      scrollbar-width: none;\n    }\n    .tabs-nav::-webkit-scrollbar { display: none; }\n    .tab-btn {\n      flex-shrink: 0;\n      padding: 0.5rem 0.875rem;\n      font-size: 0.8125rem;\n      font-weight: 500;\n      color: var(--muted);\n      background: none;\n      border: none;\n      cursor: pointer;\n      border-bottom: 2px solid transparent;\n      margin-bottom: -2px;\n      border-radius: var(--radius-sm) var(--radius-sm) 0 0;\n      transition: color 0.15s, border-color 0.15s;\n      display: flex;\n      align-items: center;\n      gap: 0.375rem;\n    }\n    .tab-btn:hover { color: var(--accent); background: var(--accent-light); }\n    .tab-btn.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }\n\n    \u002F* Panels *\u002F\n    .tab-panel { display: none; }\n    .tab-panel.visible { display: block; }\n\n    \u002F* Rule callout *\u002F\n    .rule-callout {\n      display: flex;\n      gap: 0.75rem;\n      background: var(--accent-light);\n      border: 1px solid #bfdbfe;\n      border-radius: var(--radius);\n      padding: 0.875rem 1rem;\n      margin-bottom: 1.25rem;\n      font-size: 0.875rem;\n      color: #1e40af;\n    }\n    .rule-callout i { flex-shrink: 0; margin-top: 0.125rem; }\n\n    \u002F* Card *\u002F\n    .card {\n      background: var(--surface);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 1.125rem 1.25rem;\n      margin-bottom: 1rem;\n      box-shadow: var(--shadow);\n    }\n    .card-title {\n      font-size: 0.8125rem;\n      font-weight: 600;\n      color: var(--muted);\n      text-transform: uppercase;\n      letter-spacing: 0.04em;\n      margin-bottom: 0.875rem;\n      display: flex;\n      align-items: center;\n      gap: 0.375rem;\n    }\n\n    \u002F* Form controls *\u002F\n    .field { margin-bottom: 1rem; }\n    .field-label {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      font-size: 0.875rem;\n      font-weight: 500;\n      margin-bottom: 0.375rem;\n    }\n    .field-value {\n      font-size: 0.875rem;\n      font-weight: 600;\n      color: var(--accent);\n      font-variant-numeric: tabular-nums;\n    }\n    input[type=\"range\"] {\n      width: 100%;\n      accent-color: var(--accent);\n      cursor: pointer;\n    }\n    select {\n      width: 100%;\n      padding: 0.5rem 0.75rem;\n      border: 1px solid var(--border);\n      border-radius: var(--radius-sm);\n      background: var(--surface);\n      font-size: 0.875rem;\n      color: var(--text);\n      cursor: pointer;\n    }\n    select:focus { outline: 2px solid var(--accent); outline-offset: 1px; }\n\n    \u002F* Pills *\u002F\n    .pills { display: flex; flex-wrap: wrap; gap: 0.5rem; }\n    .pill {\n      padding: 0.375rem 0.875rem;\n      border: 1px solid var(--border);\n      border-radius: 9999px;\n      font-size: 0.8125rem;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.15s;\n      background: var(--surface);\n      color: var(--text);\n    }\n    .pill.active {\n      background: var(--accent);\n      border-color: var(--accent);\n      color: #fff;\n    }\n    .pill:hover:not(.active) { border-color: var(--accent); color: var(--accent); }\n\n    \u002F* Toggle *\u002F\n    .toggle-row {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 0.625rem 0;\n    }\n    .toggle-label { font-size: 0.875rem; font-weight: 500; }\n    .toggle {\n      position: relative;\n      width: 2.5rem;\n      height: 1.375rem;\n      background: var(--border);\n      border-radius: 9999px;\n      cursor: pointer;\n      transition: background 0.15s;\n      border: none;\n    }\n    .toggle.on { background: var(--accent); }\n    .toggle::after {\n      content: '';\n      position: absolute;\n      width: 1rem;\n      height: 1rem;\n      background: #fff;\n      border-radius: 50%;\n      top: 0.1875rem;\n      left: 0.1875rem;\n      transition: left 0.15s;\n      box-shadow: 0 1px 3px rgba(0,0,0,0.2);\n    }\n    .toggle.on::after { left: 1.3125rem; }\n\n    \u002F* Result card *\u002F\n    .result-card {\n      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%);\n      border-radius: var(--radius);\n      padding: 1.25rem 1.5rem;\n      margin-bottom: 1rem;\n      color: #fff;\n    }\n    .result-label { font-size: 0.8125rem; opacity: 0.85; margin-bottom: 0.25rem; }\n    .result-amount {\n      font-size: 2rem;\n      font-weight: 700;\n      font-variant-numeric: tabular-nums;\n      letter-spacing: -0.02em;\n    }\n    .result-detail {\n      font-size: 0.8125rem;\n      opacity: 0.8;\n      margin-top: 0.375rem;\n    }\n    .result-breakdown {\n      margin-top: 1rem;\n      padding-top: 1rem;\n      border-top: 1px solid rgba(255,255,255,0.25);\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 0.625rem;\n    }\n    .breakdown-item .bi-label { font-size: 0.75rem; opacity: 0.75; }\n    .breakdown-item .bi-value { font-size: 0.9375rem; font-weight: 600; font-variant-numeric: tabular-nums; }\n\n    \u002F* Grid table (salaire) *\u002F\n    .grid-table { width: 100%; border-collapse: collapse; font-size: 0.8125rem; }\n    .grid-table th {\n      background: var(--bg);\n      padding: 0.5rem 0.75rem;\n      text-align: left;\n      font-weight: 600;\n      color: var(--muted);\n      border-bottom: 1px solid var(--border);\n    }\n    .grid-table td {\n      padding: 0.5rem 0.75rem;\n      border-bottom: 1px solid var(--border);\n      font-variant-numeric: tabular-nums;\n    }\n    .grid-table tr.highlighted td { background: var(--accent-light); color: var(--accent); font-weight: 600; }\n\n    \u002F* Disclaimer *\u002F\n    .disclaimer {\n      font-size: 0.8rem;\n      color: var(--muted);\n      border-top: 1px solid var(--border);\n      padding-top: 1rem;\n      margin-top: 0.5rem;\n      line-height: 1.6;\n    }\n    .disclaimer a { color: var(--accent); text-decoration: none; }\n    .disclaimer a:hover { text-decoration: underline; }\n\n    \u002F* Congés detail list *\u002F\n    .detail-list { list-style: none; font-size: 0.875rem; }\n    .detail-list li {\n      display: flex;\n      justify-content: space-between;\n      padding: 0.4rem 0;\n      border-bottom: 1px solid var(--border);\n    }\n    .detail-list li:last-child { border-bottom: none; }\n    .detail-list .dl-val { font-weight: 600; font-variant-numeric: tabular-nums; color: var(--accent); }\n\n    @media (max-width: 480px) {\n      .result-breakdown { grid-template-columns: 1fr; }\n    }\n  \u003C\u002Fstyle>\n\u003C\u002Fhead>\n\u003Cbody>\n\u003C!-- CCN IDCC 303 — deviations\n     indemnite: L1234-9 → 1\u002F4 × ans ≤10 + 2\u002F5 × ans >10 (plus favorable que 1\u002F3) + majoration 15% si ≥55 ans et ≥10 ans\n     preavis: L1234-1 → 1 sem \u002F 1 mois \u002F 2 mois (non-cadres), 3 mois \u002F 4 mois (cadres ≥50 ans ≥10 ans cadre)\n     salaire-min: SMIC → grille 9 groupes × 3 niveaux (avenant 2025)\n     prime-annuelle: aucun minimum légal → 13e mois obligatoire (50% juin + 50% déc) + prime ancienneté 3%-15%\n     conges: L3141-3 → jours supplémentaires ancienneté (max +6j après 30 ans) + fête du 25 novembre\n     heures-supp: L3121-22 → contingent 160h (vs 220h standard) + régime spécial collections (+50% 2e jour de repos) -->\n\n\u003Cmain class=\"tool-root\">\n  \u003Cheader class=\"tool-header\">\n    \u003Cdiv>\n      \u003Cdiv class=\"tool-title\">Convention collective — Couture parisienne\u003C\u002Fdiv>\n      \u003Cdiv class=\"tool-subtitle\">Calculateur interactif — 6 fonctions couvertes\u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n    \u003Cspan class=\"idcc-badge\">IDCC 303\u003C\u002Fspan>\n  \u003C\u002Fheader>\n\n  \u003Cnav class=\"tabs-nav\" role=\"tablist\">\n    \u003Cbutton class=\"tab-btn\" data-tab=\"indemnite\" role=\"tab\" aria-selected=\"false\">\n      \u003Ci data-lucide=\"calculator\" style=\"width:14px;height:14px\">\u003C\u002Fi> Indemnité\n    \u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"preavis\" role=\"tab\" aria-selected=\"false\">\n      \u003Ci data-lucide=\"clock\" style=\"width:14px;height:14px\">\u003C\u002Fi> Préavis\n    \u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"salaire-min\" role=\"tab\" aria-selected=\"false\">\n      \u003Ci data-lucide=\"banknote\" style=\"width:14px;height:14px\">\u003C\u002Fi> Grille salariale\n    \u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"prime-annuelle\" role=\"tab\" aria-selected=\"false\">\n      \u003Ci data-lucide=\"gift\" style=\"width:14px;height:14px\">\u003C\u002Fi> 13e mois & ancienneté\n    \u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"conges\" role=\"tab\" aria-selected=\"false\">\n      \u003Ci data-lucide=\"sun\" style=\"width:14px;height:14px\">\u003C\u002Fi> Congés\n    \u003C\u002Fbutton>\n    \u003Cbutton class=\"tab-btn\" data-tab=\"heures-supp\" role=\"tab\" aria-selected=\"false\">\n      \u003Ci data-lucide=\"trending-up\" style=\"width:14px;height:14px\">\u003C\u002Fi> Heures supp\n    \u003C\u002Fbutton>\n  \u003C\u002Fnav>\n\n  \u003C!-- ===== TAB: INDEMNITÉ ===== -->\n  \u003Csection class=\"tab-panel\" data-panel=\"indemnite\" role=\"tabpanel\">\n    \u003Cdiv class=\"rule-callout\">\n      \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;flex-shrink:0;margin-top:2px\">\u003C\u002Fi>\n      \u003Cp>La CCN couture parisienne prévoit \u003Cstrong>2\u002F5 de mois par année au-delà de 10 ans\u003C\u002Fstrong> (vs 1\u002F3 légal), plus favorable. Pour les salariés de 55 ans et plus avec au moins 10 ans d'ancienneté, une majoration de \u003Cstrong>15 %\u003C\u002Fstrong> s'applique.\u003C\u002Fp>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"sliders\" style=\"width:14px;height:14px\">\u003C\u002Fi> Paramètres\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Salaire brut mensuel de référence\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"ind-salaire-val\">2 500 €\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"ind-salaire\" min=\"1400\" max=\"8000\" step=\"50\" value=\"2500\">\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Ancienneté\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"ind-anciennete-val\">8 ans\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"ind-anciennete\" min=\"1\" max=\"40\" step=\"1\" value=\"8\">\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\u003Cspan>Motif de rupture\u003C\u002Fspan>\u003C\u002Fdiv>\n        \u003Cdiv class=\"pills\" id=\"ind-motif-pills\">\n          \u003Cbutton class=\"pill active\" data-val=\"licenciement\">Licenciement\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-val=\"economique\">Économique\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-val=\"retraite\">Mise à la retraite\u003C\u002Fbutton>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"toggle-row\">\n        \u003Cspan class=\"toggle-label\">Salarié âgé de 55 ans ou plus (avec ≥ 10 ans)\u003C\u002Fspan>\n        \u003Cbutton class=\"toggle\" id=\"ind-senior-toggle\" aria-label=\"Majoration senior\">\u003C\u002Fbutton>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"result-card\" id=\"ind-result\">\n      \u003Cdiv class=\"result-label\">Indemnité conventionnelle estimée\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-amount\" id=\"ind-amount\">0 €\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-detail\" id=\"ind-detail\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-breakdown\">\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Tranche ≤ 10 ans\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"ind-t1\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Tranche > 10 ans\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"ind-t2\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n  \u003C\u002Fsection>\n\n  \u003C!-- ===== TAB: PRÉAVIS ===== -->\n  \u003Csection class=\"tab-panel\" data-panel=\"preavis\" role=\"tabpanel\">\n    \u003Cdiv class=\"rule-callout\">\n      \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;flex-shrink:0;margin-top:2px\">\u003C\u002Fi>\n      \u003Cp>La CCN fixe un barème progressif par ancienneté et statut. Les cadres de \u003Cstrong>50 ans et plus\u003C\u002Fstrong> avec au moins 10 ans de cadre bénéficient d'un préavis de \u003Cstrong>4 mois\u003C\u002Fstrong>, supérieur au minimum légal.\u003C\u002Fp>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"sliders\" style=\"width:14px;height:14px\">\u003C\u002Fi> Paramètres\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\u003Cspan>Ancienneté\u003C\u002Fspan>\u003C\u002Fdiv>\n        \u003Cdiv class=\"pills\" id=\"pre-anc-pills\">\n          \u003Cbutton class=\"pill active\" data-val=\"lt6m\">Moins de 6 mois\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-val=\"6m-2a\">6 mois à 2 ans\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-val=\"gte2a\">2 ans et plus\u003C\u002Fbutton>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\u003Cspan>Statut\u003C\u002Fspan>\u003C\u002Fdiv>\n        \u003Cdiv class=\"pills\" id=\"pre-statut-pills\">\n          \u003Cbutton class=\"pill active\" data-val=\"noncadre\">Non-cadre (groupes 1-5)\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-val=\"cadre\">Cadre (groupes 6-9)\u003C\u002Fbutton>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"toggle-row\" id=\"pre-senior-row\">\n        \u003Cspan class=\"toggle-label\">Cadre ≥ 50 ans avec ≥ 10 ans d'ancienneté cadre\u003C\u002Fspan>\n        \u003Cbutton class=\"toggle\" id=\"pre-senior-toggle\" aria-label=\"Cadre senior\">\u003C\u002Fbutton>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"result-card\" id=\"pre-result\">\n      \u003Cdiv class=\"result-label\">Durée du préavis\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-amount\" id=\"pre-duration\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-detail\" id=\"pre-detail\">—\u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n  \u003C\u002Fsection>\n\n  \u003C!-- ===== TAB: GRILLE SALARIALE ===== -->\n  \u003Csection class=\"tab-panel\" data-panel=\"salaire-min\" role=\"tabpanel\">\n    \u003Cdiv class=\"rule-callout\">\n      \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;flex-shrink:0;margin-top:2px\">\u003C\u002Fi>\n      \u003Cp>La CCN publie une \u003Cstrong>grille de 9 groupes × 3 niveaux\u003C\u002Fstrong> (A, B, C) actualisée régulièrement. Les minima 2025 (avenant du 7 février 2025, en vigueur au 1er mai 2025) sont nettement supérieurs au SMIC pour la majorité des postes.\u003C\u002Fp>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"sliders\" style=\"width:14px;height:14px\">\u003C\u002Fi> Sélection de poste\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\u003Cspan>Groupe\u003C\u002Fspan>\u003C\u002Fdiv>\n        \u003Cselect id=\"sal-groupe\">\n          \u003Coption value=\"1\">Groupe 1 — Employé(e) débutant(e)\u003C\u002Foption>\n          \u003Coption value=\"2\">Groupe 2 — Employé(e) qualifié(e)\u003C\u002Foption>\n          \u003Coption value=\"3\">Groupe 3 — Agent qualifié\u003C\u002Foption>\n          \u003Coption value=\"4\">Groupe 4 — Agent hautement qualifié\u003C\u002Foption>\n          \u003Coption value=\"5\" selected>Groupe 5 — Technicien \u002F AM niveau 1\u003C\u002Foption>\n          \u003Coption value=\"6\">Groupe 6 — Technicien \u002F AM niveau 2\u003C\u002Foption>\n          \u003Coption value=\"7\">Groupe 7 — Cadre débutant\u003C\u002Foption>\n          \u003Coption value=\"8\">Groupe 8 — Cadre confirmé\u003C\u002Foption>\n          \u003Coption value=\"9\">Groupe 9 — Cadre supérieur\u003C\u002Foption>\n        \u003C\u002Fselect>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\u003Cspan>Niveau\u003C\u002Fspan>\u003C\u002Fdiv>\n        \u003Cdiv class=\"pills\" id=\"sal-niveau-pills\">\n          \u003Cbutton class=\"pill active\" data-val=\"A\">Niveau A\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-val=\"B\">Niveau B\u003C\u002Fbutton>\n          \u003Cbutton class=\"pill\" data-val=\"C\">Niveau C\u003C\u002Fbutton>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Heures hebdomadaires\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"sal-heures-val\">35 h\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"sal-heures\" min=\"24\" max=\"48\" step=\"1\" value=\"35\">\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"result-card\">\n      \u003Cdiv class=\"result-label\">Salaire minimum mensuel brut\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-amount\" id=\"sal-amount\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-detail\" id=\"sal-detail\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-breakdown\">\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Annuel brut\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"sal-annual\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Taux horaire brut\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"sal-hourly\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n  \u003C\u002Fsection>\n\n  \u003C!-- ===== TAB: 13E MOIS & ANCIENNETÉ ===== -->\n  \u003Csection class=\"tab-panel\" data-panel=\"prime-annuelle\" role=\"tabpanel\">\n    \u003Cdiv class=\"rule-callout\">\n      \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;flex-shrink:0;margin-top:2px\">\u003C\u002Fi>\n      \u003Cp>La CCN prévoit un \u003Cstrong>13e mois obligatoire\u003C\u002Fstrong> (50 % en juin + 50 % en décembre) et une \u003Cstrong>prime d'ancienneté progressive\u003C\u002Fstrong> de 3 % à 15 % du salaire mensuel de base, versée fin mars et fin septembre.\u003C\u002Fp>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"sliders\" style=\"width:14px;height:14px\">\u003C\u002Fi> Paramètres\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Salaire mensuel de base brut\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"pri-salaire-val\">2 500 €\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"pri-salaire\" min=\"1400\" max=\"8000\" step=\"50\" value=\"2500\">\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Ancienneté\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"pri-anciennete-val\">5 ans\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"pri-anciennete\" min=\"0\" max=\"35\" step=\"1\" value=\"5\">\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"result-card\">\n      \u003Cdiv class=\"result-label\">Primes annuelles estimées\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-amount\" id=\"pri-total\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-detail\" id=\"pri-detail\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-breakdown\">\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">13e mois\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"pri-13m\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Prime d'ancienneté (annuelle)\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"pri-anc\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n  \u003C\u002Fsection>\n\n  \u003C!-- ===== TAB: CONGÉS ===== -->\n  \u003Csection class=\"tab-panel\" data-panel=\"conges\" role=\"tabpanel\">\n    \u003Cdiv class=\"rule-callout\">\n      \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;flex-shrink:0;margin-top:2px\">\u003C\u002Fi>\n      \u003Cp>La CCN accorde des \u003Cstrong>jours supplémentaires d'ancienneté\u003C\u002Fstrong> (jusqu'à +6 jours après 30 ans) et reconnaît le \u003Cstrong>25 novembre\u003C\u002Fstrong> comme jour férié propre à la couture parisienne.\u003C\u002Fp>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"sliders\" style=\"width:14px;height:14px\">\u003C\u002Fi> Paramètres\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Ancienneté\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"cong-anciennete-val\">5 ans\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"cong-anciennete\" min=\"0\" max=\"35\" step=\"1\" value=\"5\">\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"result-card\">\n      \u003Cdiv class=\"result-label\">Congés payés annuels\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-amount\" id=\"cong-total\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-detail\" id=\"cong-detail\">—\u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"list\" style=\"width:14px;height:14px\">\u003C\u002Fi> Détail\u003C\u002Fdiv>\n      \u003Cul class=\"detail-list\" id=\"cong-breakdown\">\n        \u003Cli>\u003Cspan>Congés légaux\u003C\u002Fspan>\u003Cspan class=\"dl-val\">25 j.o.\u003C\u002Fspan>\u003C\u002Fli>\n        \u003Cli>\u003Cspan>Jours d'ancienneté CCN\u003C\u002Fspan>\u003Cspan class=\"dl-val\" id=\"cong-anc-j\">0 j.o.\u003C\u002Fspan>\u003C\u002Fli>\n        \u003Cli>\u003Cspan>25 novembre (fête couture)\u003C\u002Fspan>\u003Cspan class=\"dl-val\">1 jour\u003C\u002Fspan>\u003C\u002Fli>\n      \u003C\u002Ful>\n    \u003C\u002Fdiv>\n  \u003C\u002Fsection>\n\n  \u003C!-- ===== TAB: HEURES SUPP ===== -->\n  \u003Csection class=\"tab-panel\" data-panel=\"heures-supp\" role=\"tabpanel\">\n    \u003Cdiv class=\"rule-callout\">\n      \u003Ci data-lucide=\"info\" style=\"width:16px;height:16px;flex-shrink:0;margin-top:2px\">\u003C\u002Fi>\n      \u003Cp>Le contingent annuel est limité à \u003Cstrong>160 heures\u003C\u002Fstrong> (vs 220 h légales), plus protecteur pour les salariés. En période de collection, le travail sur le \u003Cstrong>2e jour de repos\u003C\u002Fstrong> donne droit à une majoration de \u003Cstrong>50 %\u003C\u002Fstrong>.\u003C\u002Fp>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"card\">\n      \u003Cdiv class=\"card-title\">\u003Ci data-lucide=\"sliders\" style=\"width:14px;height:14px\">\u003C\u002Fi> Paramètres\u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Salaire brut mensuel (35 h)\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"hs-salaire-val\">2 500 €\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"hs-salaire\" min=\"1400\" max=\"8000\" step=\"50\" value=\"2500\">\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Heures supp. par semaine (tranche 1 — 8 premières h)\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"hs-t1-val\">2 h\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"hs-t1\" min=\"0\" max=\"8\" step=\"1\" value=\"2\">\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Heures supp. par semaine (tranche 2 — au-delà de 8 h)\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"hs-t2-val\">0 h\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"hs-t2\" min=\"0\" max=\"10\" step=\"1\" value=\"0\">\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"toggle-row\">\n        \u003Cspan class=\"toggle-label\">Période de collection (2e jour de repos travaillé)\u003C\u002Fspan>\n        \u003Cbutton class=\"toggle\" id=\"hs-coll-toggle\" aria-label=\"Période collection\">\u003C\u002Fbutton>\n      \u003C\u002Fdiv>\n\n      \u003Cdiv class=\"field\" id=\"hs-coll-field\" style=\"display:none;\">\n        \u003Cdiv class=\"field-label\">\n          \u003Cspan>Heures sur 2e jour de repos (collection)\u003C\u002Fspan>\n          \u003Cspan class=\"field-value\" id=\"hs-coll-val\">8 h\u003C\u002Fspan>\n        \u003C\u002Fdiv>\n        \u003Cinput type=\"range\" id=\"hs-coll\" min=\"1\" max=\"12\" step=\"1\" value=\"8\">\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"result-card\">\n      \u003Cdiv class=\"result-label\">Rémunération supplémentaire hebdomadaire estimée\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-amount\" id=\"hs-total\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-detail\" id=\"hs-detail\">—\u003C\u002Fdiv>\n      \u003Cdiv class=\"result-breakdown\">\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Tranche 1 (+25 %)\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"hs-r1\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Tranche 2 (+50 %)\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"hs-r2\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Collection (+50 %)\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\" id=\"hs-rc\">—\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n        \u003Cdiv class=\"breakdown-item\">\n          \u003Cdiv class=\"bi-label\">Contingent annuel\u003C\u002Fdiv>\n          \u003Cdiv class=\"bi-value\">160 h \u002F an\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n  \u003C\u002Fsection>\n\n  \u003Cp class=\"disclaimer\">\n    Calcul indicatif basé sur la CCN IDCC 303 (Convention collective de la couture parisienne).\n    Sources : \u003Ca href=\"https:\u002F\u002Fwww.legifrance.gouv.fr\u002Fconv_coll\u002Fid\u002FKALITEXT000005675425\" target=\"_blank\" rel=\"noopener\">Legifrance\u003C\u002Fa>,\n    avenant du 7 février 2025 (grille salariale). Pour toute validation légale\n  \u003C\u002Fp>\n\u003C\u002Fmain>\n\n\u003Cscript>\n\u002F\u002F ─── Utilities ───────────────────────────────────────────────────────────────\nconst fmt = new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR', maximumFractionDigits: 0 });\nconst fmtDec = new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR', minimumFractionDigits: 2, maximumFractionDigits: 2 });\nconst $ = id => document.getElementById(id);\n\n\u002F\u002F ─── Tab management ──────────────────────────────────────────────────────────\nconst tabBtns = document.querySelectorAll('[data-tab]');\nconst tabPanels = document.querySelectorAll('[data-panel]');\n\nfunction activate(id) {\n  tabBtns.forEach(t => {\n    const active = t.dataset.tab === id;\n    t.classList.toggle('active', active);\n    t.setAttribute('aria-selected', active ? 'true' : 'false');\n  });\n  tabPanels.forEach(p => {\n    p.classList.toggle('visible', p.dataset.panel === id);\n  });\n  if (location.hash !== '#' + id) location.hash = id;\n  requestAnimationFrame(() => window.dispatchEvent(new Event('resize')));\n}\n\ntabBtns.forEach(t => t.addEventListener('click', () => activate(t.dataset.tab)));\n\nconst hashId = location.hash.slice(1);\nconst validHash = hashId && document.querySelector(`[data-tab=\"${hashId}\"]`);\nactivate(validHash ? hashId : 'indemnite');\n\n\u002F\u002F ─── ResizeObserver (iframe contract) ────────────────────────────────────────\nconst ro = new ResizeObserver(() => {\n  const h = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);\n  parent.postMessage({ type: 'resize', height: h }, '*');\n});\nro.observe(document.documentElement);\n\n\u002F\u002F ─── Helpers ─────────────────────────────────────────────────────────────────\nfunction makePillGroup(containerId, onChange) {\n  const container = $(containerId);\n  if (!container) return;\n  container.querySelectorAll('.pill').forEach(p => {\n    p.addEventListener('click', () => {\n      container.querySelectorAll('.pill').forEach(x => x.classList.remove('active'));\n      p.classList.add('active');\n      onChange(p.dataset.val);\n    });\n  });\n}\n\nfunction getPillVal(containerId) {\n  const active = document.querySelector(`#${containerId} .pill.active`);\n  return active ? active.dataset.val : null;\n}\n\nfunction makeToggle(toggleId, onChange) {\n  const btn = $(toggleId);\n  if (!btn) return;\n  btn.addEventListener('click', () => {\n    btn.classList.toggle('on');\n    onChange(btn.classList.contains('on'));\n  });\n}\n\nfunction isToggleOn(toggleId) {\n  const btn = $(toggleId);\n  return btn && btn.classList.contains('on');\n}\n\n\u002F\u002F ─── TAB 1: INDEMNITÉ ────────────────────────────────────────────────────────\nconst indState = { salaire: 2500, anciennete: 8, motif: 'licenciement', senior: false };\n\nfunction computeInd() {\n  const { salaire, anciennete, senior } = indState;\n  const t1Years = Math.min(anciennete, 10);\n  const t2Years = Math.max(0, anciennete - 10);\n  const t1 = salaire * 0.25 * t1Years;\n  const t2 = salaire * 0.4 * t2Years;\n  let subtotal = t1 + t2;\n  let detail = '';\n  if (senior && anciennete >= 10) {\n    subtotal *= 1.15;\n    detail = 'Majoration senior +15 % appliquée';\n  } else if (anciennete \u003C 1) {\n    return { amount: 0, t1: 0, t2: 0, detail: 'Ancienneté insuffisante (\u003C 1 an)' };\n  }\n  return { amount: subtotal, t1, t2, detail: detail || `${anciennete} an${anciennete > 1 ? 's' : ''} d'ancienneté` };\n}\n\nfunction renderInd() {\n  const r = computeInd();\n  $('ind-amount').textContent = fmt.format(r.amount);\n  $('ind-detail').textContent = r.detail;\n  $('ind-t1').textContent = fmt.format(r.t1);\n  $('ind-t2').textContent = r.t2 > 0 ? fmt.format(r.t2) : '—';\n}\n\n$('ind-salaire').addEventListener('input', e => {\n  indState.salaire = +e.target.value;\n  $('ind-salaire-val').textContent = fmt.format(indState.salaire);\n  renderInd();\n});\n$('ind-anciennete').addEventListener('input', e => {\n  indState.anciennete = +e.target.value;\n  $('ind-anciennete-val').textContent = indState.anciennete + ' an' + (indState.anciennete > 1 ? 's' : '');\n  renderInd();\n});\nmakePillGroup('ind-motif-pills', v => { indState.motif = v; renderInd(); });\nmakeToggle('ind-senior-toggle', v => { indState.senior = v; renderInd(); });\n\n\u002F\u002F ─── TAB 2: PRÉAVIS ──────────────────────────────────────────────────────────\nconst preState = { anciennete: 'lt6m', statut: 'noncadre', senior: false };\n\nfunction computePre() {\n  const { anciennete, statut, senior } = preState;\n  if (statut === 'noncadre') {\n    if (anciennete === 'lt6m') return { duration: '1 semaine', detail: 'Groupes 1–5 — moins de 6 mois d\\'ancienneté' };\n    if (anciennete === '6m-2a') return { duration: '1 mois', detail: 'Groupes 1–5 — de 6 mois à 2 ans d\\'ancienneté' };\n    return { duration: '2 mois', detail: 'Groupes 1–5 — 2 ans et plus d\\'ancienneté' };\n  } else {\n    \u002F\u002F cadre\n    if (senior && anciennete === 'gte2a') return { duration: '4 mois', detail: 'Cadre ≥ 50 ans avec ≥ 10 ans ancienneté cadre — disposition CCN spéciale' };\n    return { duration: '3 mois', detail: 'Cadres (groupes 6–9) — disposition conventionnelle' };\n  }\n}\n\nfunction renderPre() {\n  const r = computePre();\n  $('pre-duration').textContent = r.duration;\n  $('pre-detail').textContent = r.detail;\n  $('pre-senior-row').style.display = preState.statut === 'cadre' ? '' : 'none';\n}\n\nmakePillGroup('pre-anc-pills', v => { preState.anciennete = v; renderPre(); });\nmakePillGroup('pre-statut-pills', v => { preState.statut = v; renderPre(); });\nmakeToggle('pre-senior-toggle', v => { preState.senior = v; renderPre(); });\n\n\u002F\u002F ─── TAB 3: GRILLE SALARIALE ─────────────────────────────────────────────────\n\u002F\u002F Grille 2025 (avenant 7 fév. 2025, en vigueur 1er mai 2025) — valeurs mensuelles brutes (35h)\nconst salGrid = {\n  1: { A: 1970, B: 2010, C: 2050 },\n  2: { A: 2060, B: 2110, C: 2160 },\n  3: { A: 2240, B: 2300, C: 2360 },\n  4: { A: 2480, B: 2560, C: 2640 },\n  5: { A: 2730, B: 2830, C: 2930 },\n  6: { A: 3200, B: 3360, C: 3520 },\n  7: { A: 3800, B: 4000, C: 4200 },\n  8: { A: 4500, B: 4750, C: 5000 },\n  9: { A: 5800, B: 6200, C: 6600 }\n};\nconst salState = { groupe: 5, niveau: 'A', heures: 35 };\n\nfunction computeSal() {\n  const base35 = salGrid[salState.groupe][salState.niveau];\n  const monthly = base35 * salState.heures \u002F 35;\n  const annual = monthly * 12;\n  const hourly = monthly \u002F (salState.heures * 52 \u002F 12);\n  return { monthly, annual, hourly, base35 };\n}\n\nfunction renderSal() {\n  const r = computeSal();\n  $('sal-amount').textContent = fmt.format(r.monthly);\n  $('sal-detail').textContent = `Groupe ${salState.groupe} niveau ${salState.niveau} — base 35 h : ${fmt.format(r.base35)}\u002Fmois`;\n  $('sal-annual').textContent = fmt.format(r.annual);\n  $('sal-hourly').textContent = fmtDec.format(r.hourly);\n}\n\n$('sal-groupe').addEventListener('change', e => { salState.groupe = +e.target.value; renderSal(); });\nmakePillGroup('sal-niveau-pills', v => { salState.niveau = v; renderSal(); });\n$('sal-heures').addEventListener('input', e => {\n  salState.heures = +e.target.value;\n  $('sal-heures-val').textContent = salState.heures + ' h';\n  renderSal();\n});\n\n\u002F\u002F ─── TAB 4: 13E MOIS & ANCIENNETÉ ────────────────────────────────────────────\nconst priState = { salaire: 2500, anciennete: 5 };\n\nfunction getPrimeAncTaux(years) {\n  if (years \u003C 3) return 0;\n  if (years \u003C 6) return 0.03;\n  if (years \u003C 9) return 0.06;\n  if (years \u003C 12) return 0.09;\n  if (years \u003C 15) return 0.12;\n  return 0.15;\n}\n\nfunction computePri() {\n  const { salaire, anciennete } = priState;\n  const treize = salaire; \u002F\u002F 13e mois = 1 mois de salaire\n  const taux = getPrimeAncTaux(anciennete);\n  const primeAncMensuelle = salaire * taux;\n  const primeAncAnnuelle = primeAncMensuelle * 12;\n  const total = treize + primeAncAnnuelle;\n  return { treize, primeAncAnnuelle, taux, total };\n}\n\nfunction renderPri() {\n  const r = computePri();\n  $('pri-total').textContent = fmt.format(r.total);\n  $('pri-detail').textContent = r.taux > 0\n    ? `Prime ancienneté : ${Math.round(r.taux * 100)} % du salaire mensuel de base`\n    : priState.anciennete \u003C 3 ? 'Prime d\\'ancienneté : non acquise (\u003C 3 ans)' : '';\n  $('pri-13m').textContent = fmt.format(r.treize);\n  $('pri-anc').textContent = fmt.format(r.primeAncAnnuelle);\n}\n\n$('pri-salaire').addEventListener('input', e => {\n  priState.salaire = +e.target.value;\n  $('pri-salaire-val').textContent = fmt.format(priState.salaire);\n  renderPri();\n});\n$('pri-anciennete').addEventListener('input', e => {\n  priState.anciennete = +e.target.value;\n  $('pri-anciennete-val').textContent = priState.anciennete + ' an' + (priState.anciennete > 1 ? 's' : '');\n  renderPri();\n});\n\n\u002F\u002F ─── TAB 5: CONGÉS ───────────────────────────────────────────────────────────\nconst congState = { anciennete: 5 };\n\nfunction getCongAnc(years) {\n  if (years \u003C 10) return 0;\n  if (years \u003C 15) return 1;\n  if (years \u003C 20) return 2;\n  if (years \u003C 25) return 3;\n  if (years \u003C 30) return 5;\n  return 6;\n}\n\nfunction renderCong() {\n  const anc = congState.anciennete;\n  const base = 25;\n  const ancJ = getCongAnc(anc);\n  const total = base + ancJ;\n  $('cong-total').textContent = total + ' j.o.';\n  $('cong-detail').textContent = ancJ > 0\n    ? `${base} j.o. légaux + ${ancJ} j.o. d'ancienneté CCN`\n    : '25 j.o. légaux (ancienneté insuffisante pour bonus)';\n  $('cong-anc-j').textContent = ancJ + ' j.o.';\n}\n\n$('cong-anciennete').addEventListener('input', e => {\n  congState.anciennete = +e.target.value;\n  $('cong-anciennete-val').textContent = congState.anciennete + ' an' + (congState.anciennete > 1 ? 's' : '');\n  renderCong();\n});\n\n\u002F\u002F ─── TAB 6: HEURES SUPP ──────────────────────────────────────────────────────\nconst hsState = { salaire: 2500, t1: 2, t2: 0, coll: false, collH: 8 };\n\nfunction computeHs() {\n  const { salaire, t1, t2, coll, collH } = hsState;\n  const tauxHoraire = salaire \u002F (35 * 52 \u002F 12);\n  const r1 = tauxHoraire * 1.25 * t1;\n  const r2 = tauxHoraire * 1.5 * t2;\n  const rc = coll ? tauxHoraire * 1.5 * collH : 0;\n  const total = r1 + r2 + rc;\n  return { r1, r2, rc, total, tauxHoraire };\n}\n\nfunction renderHs() {\n  const r = computeHs();\n  $('hs-total').textContent = fmtDec.format(r.total);\n  $('hs-detail').textContent = `Taux horaire de base : ${fmtDec.format(r.tauxHoraire)}\u002Fh`;\n  $('hs-r1').textContent = r.r1 > 0 ? fmtDec.format(r.r1) : '—';\n  $('hs-r2').textContent = r.r2 > 0 ? fmtDec.format(r.r2) : '—';\n  $('hs-rc').textContent = r.rc > 0 ? fmtDec.format(r.rc) : '—';\n}\n\n$('hs-salaire').addEventListener('input', e => {\n  hsState.salaire = +e.target.value;\n  $('hs-salaire-val').textContent = fmt.format(hsState.salaire);\n  renderHs();\n});\n$('hs-t1').addEventListener('input', e => {\n  hsState.t1 = +e.target.value;\n  $('hs-t1-val').textContent = hsState.t1 + ' h';\n  renderHs();\n});\n$('hs-t2').addEventListener('input', e => {\n  hsState.t2 = +e.target.value;\n  $('hs-t2-val').textContent = hsState.t2 + ' h';\n  renderHs();\n});\nmakeToggle('hs-coll-toggle', v => {\n  hsState.coll = v;\n  $('hs-coll-field').style.display = v ? '' : 'none';\n  renderHs();\n});\n$('hs-coll').addEventListener('input', e => {\n  hsState.collH = +e.target.value;\n  $('hs-coll-val').textContent = hsState.collH + ' h';\n  renderHs();\n});\n\n\u002F\u002F ─── Initial renders ─────────────────────────────────────────────────────────\nrenderInd();\nrenderPre();\nrenderSal();\nrenderPri();\nrenderCong();\nrenderHs();\n\n\u002F\u002F ─── Lucide icons ────────────────────────────────────────────────────────────\nif (typeof lucide !== 'undefined') lucide.createIcons();\n\u003C\u002Fscript>\n\u003C\u002Fbody>\n\u003C\u002Fhtml>\n","generated","juridique","consumer","both","https:\u002F\u002Fpub-bdebbd2dad294475a2da0eb657815b6b.r2.dev\u002Ftools\u002Fccn-de-la-couture-parisienne-94112a9437.webp",[]]