{"id":988714,"date":"2026-05-13T23:14:15","date_gmt":"2026-05-14T04:14:15","guid":{"rendered":"https:\/\/cgestiona.com\/?page_id=988714"},"modified":"2026-05-13T23:19:13","modified_gmt":"2026-05-14T04:19:13","slug":"calculadora-vacaciones-planilla","status":"publish","type":"page","link":"https:\/\/cgestiona.com\/en\/calculadora-vacaciones-planilla\/","title":{"rendered":"Payroll Vacation Calculator"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"988714\" class=\"elementor elementor-988714\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6df9c3e2 e-con-full e-flex e-con e-parent\" data-id=\"6df9c3e2\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-a7adec1 e-con-full e-flex e-con e-child\" data-id=\"a7adec1\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-6abd849f e-con-full e-flex e-con e-child\" data-id=\"6abd849f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5a824e42 elementor-widget elementor-widget-heading\" data-id=\"5a824e42\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Calculadora de Vacaciones de Planilla<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"vamtam-has-theme-widget-styles elementor-element elementor-element-40266976 elementor-widget elementor-widget-text-editor\" data-id=\"40266976\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\tCalcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado.\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3af8bf8a e-flex e-con-boxed e-con e-parent\" data-id=\"3af8bf8a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f6c698a elementor-widget-divider--separator-type-pattern elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"f6c698a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\" style=\"--divider-pattern-url: url(&quot;data:image\/svg+xml,%3Csvg xmlns=&#039;http:\/\/www.w3.org\/2000\/svg&#039; preserveAspectRatio=&#039;none&#039; overflow=&#039;visible&#039; height=&#039;100%&#039; viewBox=&#039;0 0 20 16&#039; fill=&#039;none&#039; stroke=&#039;black&#039; stroke-width=&#039;1&#039; stroke-linecap=&#039;square&#039; stroke-miterlimit=&#039;10&#039;%3E%3Cg transform=&#039;translate(-12.000000, 0)&#039;%3E%3Cpath d=&#039;M28,0L10,18&#039;\/%3E%3Cpath d=&#039;M18,0L0,18&#039;\/%3E%3Cpath d=&#039;M48,0L30,18&#039;\/%3E%3Cpath d=&#039;M38,0L20,18&#039;\/%3E%3C\/g%3E%3C\/svg%3E&quot;);\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4a165d8 e-flex e-con-boxed e-con e-parent\" data-id=\"4a165d8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3ddac2b6 elementor-widget elementor-widget-html\" data-id=\"3ddac2b6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!--\r\n================================================================\r\n  CALCULADORA DE VACACIONES \u2014 C GESTIONA\r\n  Versi\u00f3n: 1.0 | Base legal: D.L. 713 \/ D.S. 012-92-TR\r\n  R\u00e9gimen General, Peque\u00f1a Empresa, Microempresa REMYPE\r\n  Modos: Ganadas \/ Truncas \/ Triple Vacacional\r\n  Compatible con: Elementor (widget HTML)\r\n================================================================\r\n-->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/@tabler\/icons-webfont@2.47.0\/tabler-icons.min.css\">\r\n\r\n<div class=\"cgc-wrapper cgc-vc\">\r\n\r\n<style>\r\n.cgc-wrapper, .cgc-wrapper * { box-sizing: border-box; }\r\n.cgc-wrapper {\r\n  font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\r\n  font-size: 14px; line-height: 1.5; color: #111827;\r\n  max-width: 720px; margin: 24px auto;\r\n}\r\n.cgc-wrapper h1, .cgc-wrapper h2, .cgc-wrapper h3, .cgc-wrapper h4 {\r\n  margin: 0; padding: 0; font-family: inherit; font-weight: 500;\r\n  line-height: 1.3; color: inherit; letter-spacing: normal; text-transform: none;\r\n}\r\n.cgc-wrapper p { margin: 0; padding: 0; }\r\n.cgc-wrapper input, .cgc-wrapper select, .cgc-wrapper button {\r\n  font-family: inherit; font-size: inherit; line-height: inherit;\r\n}\r\n\r\n\/* Header *\/\r\n.cgc-vc .cgc-header {\r\n  background: #0F3D3A; border-radius: 12px 12px 0 0;\r\n  padding: 18px 22px; display: flex; align-items: center;\r\n  justify-content: space-between; flex-wrap: wrap; gap: 12px;\r\n}\r\n.cgc-vc .cgc-header-left { display: flex; align-items: center; gap: 16px; }\r\n.cgc-vc .cgc-logo { height: 48px; width: auto; flex-shrink: 0; display: block; }\r\n.cgc-vc .cgc-header-title-block {\r\n  border-left: 1px solid rgba(255,255,255,0.25); padding-left: 16px;\r\n}\r\n.cgc-vc .cgc-header-eyebrow {\r\n  font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase;\r\n  color: rgba(255,255,255,0.6); font-weight: 500; margin-bottom: 2px;\r\n}\r\n.cgc-vc .cgc-header-title {\r\n  color: #ffffff !important; font-size: 18px !important;\r\n  font-weight: 500 !important; margin: 0 !important;\r\n}\r\n.cgc-vc .cgc-pill {\r\n  display: inline-flex; align-items: center; gap: 8px;\r\n  background: rgba(255,255,255,0.08); padding: 6px 12px;\r\n  border-radius: 999px; color: rgba(255,255,255,0.9); font-size: 12px;\r\n}\r\n.cgc-vc .cgc-pill .ti { font-size: 14px; color: #22A559; }\r\n\r\n.cgc-vc .cgc-body {\r\n  background: #ffffff; border: 1px solid #E5E7EB;\r\n  border-top: none; border-radius: 0 0 12px 12px;\r\n  padding: 20px 22px;\r\n}\r\n.cgc-vc .cgc-intro {\r\n  margin: 0 0 16px; font-size: 13px; color: #4B5563;\r\n  display: flex; align-items: flex-start; gap: 8px;\r\n}\r\n.cgc-vc .cgc-intro .ti { font-size: 16px; color: #22A559; flex-shrink: 0; margin-top: 2px; }\r\n\r\n\/* Toggle modo *\/\r\n.cgc-vc .cgc-mode-toggle {\r\n  display: flex; background: #F9FAFB; border: 1px solid #D1D5DB;\r\n  border-radius: 7px; padding: 3px; margin-bottom: 14px;\r\n}\r\n.cgc-vc .cgc-mode-btn {\r\n  flex: 1; padding: 8px 10px; border: none; background: transparent;\r\n  font-size: 12px; font-weight: 500; color: #6B7280; border-radius: 5px;\r\n  cursor: pointer; transition: all 0.15s;\r\n  display: inline-flex; align-items: center; justify-content: center; gap: 6px;\r\n}\r\n.cgc-vc .cgc-mode-btn .ti { font-size: 14px; }\r\n.cgc-vc .cgc-mode-btn.active { background: #0F3D3A; color: #ffffff; }\r\n\r\n\/* Secciones *\/\r\n.cgc-vc .cgc-section {\r\n  border: 1px solid #E5E7EB; border-radius: 10px; padding: 16px;\r\n  margin-bottom: 12px; background: #FAFAF9;\r\n}\r\n.cgc-vc .cgc-section-title {\r\n  display: flex; align-items: center; gap: 8px;\r\n  margin: 0 0 12px !important;\r\n  font-size: 14px !important; font-weight: 500 !important; color: #0F3D3A !important;\r\n}\r\n.cgc-vc .cgc-letter {\r\n  display: inline-flex; align-items: center; justify-content: center;\r\n  width: 22px; height: 22px; border-radius: 6px;\r\n  background: #0F3D3A; color: #ffffff; font-size: 11px; font-weight: 500;\r\n}\r\n\r\n\/* Inputs *\/\r\n.cgc-vc .cgc-label {\r\n  display: block; font-size: 12px; color: #4B5563;\r\n  margin-bottom: 5px; font-weight: 500;\r\n}\r\n.cgc-vc .cgc-input,\r\n.cgc-vc .cgc-select {\r\n  width: 100%; padding: 9px 11px; border: 1px solid #D1D5DB;\r\n  border-radius: 7px; font-size: 13px; background: #ffffff;\r\n  color: #111827; outline: none; appearance: none;\r\n  -webkit-appearance: none;\r\n  transition: border-color 0.15s, box-shadow 0.15s;\r\n}\r\n.cgc-vc .cgc-select {\r\n  cursor: pointer;\r\n  background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'\/%3E%3C\/svg%3E\");\r\n  background-repeat: no-repeat;\r\n  background-position: right 10px center;\r\n  padding-right: 32px;\r\n}\r\n.cgc-vc .cgc-input:focus,\r\n.cgc-vc .cgc-select:focus {\r\n  border-color: #22A559; box-shadow: 0 0 0 3px rgba(34,165,89,0.15);\r\n}\r\n\r\n.cgc-vc .cgc-input-prefix {\r\n  display: flex; align-items: stretch;\r\n  border: 1px solid #D1D5DB; border-radius: 7px;\r\n  overflow: hidden; background: #ffffff;\r\n  transition: border-color 0.15s, box-shadow 0.15s;\r\n}\r\n.cgc-vc .cgc-input-prefix:focus-within {\r\n  border-color: #22A559; box-shadow: 0 0 0 3px rgba(34,165,89,0.15);\r\n}\r\n.cgc-vc .cgc-input-prefix span {\r\n  display: flex; align-items: center; padding: 0 12px;\r\n  background: #F9FAFB; border-right: 1px solid #D1D5DB;\r\n  color: #6B7280; font-size: 13px; font-weight: 500;\r\n  flex-shrink: 0; pointer-events: none;\r\n}\r\n.cgc-vc .cgc-input-prefix .cgc-input {\r\n  flex: 1; border: none; padding: 9px 11px;\r\n  font-size: 14px; background: transparent;\r\n  outline: none; min-width: 0; width: 100%; border-radius: 0;\r\n}\r\n.cgc-vc .cgc-input-prefix .cgc-input:focus {\r\n  box-shadow: none; border: none;\r\n}\r\n\r\n.cgc-vc .cgc-grid-2 {\r\n  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;\r\n}\r\n.cgc-vc .cgc-grid-3 {\r\n  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px;\r\n}\r\n\r\n\/* Banner per\u00edodo *\/\r\n.cgc-vc .cgc-banner {\r\n  margin-top: 10px; padding: 8px 12px;\r\n  background: rgba(34,165,89,0.08); border-radius: 6px;\r\n  font-size: 12px; color: #0F6E3D; font-weight: 500;\r\n  display: flex; align-items: center; gap: 6px;\r\n}\r\n.cgc-vc .cgc-banner .ti { font-size: 14px; }\r\n\r\n\/* Errores *\/\r\n.cgc-vc .cgc-error {\r\n  margin-top: 10px; padding: 10px 14px;\r\n  background: rgba(239,68,68,0.08); border: 1px solid rgba(239,68,68,0.3);\r\n  border-radius: 7px; font-size: 12px; color: #991B1B;\r\n  display: flex; align-items: flex-start; gap: 8px;\r\n}\r\n.cgc-vc .cgc-error.hidden { display: none; }\r\n.cgc-vc .cgc-error .ti { font-size: 16px; flex-shrink: 0; margin-top: 1px; color: #DC2626; }\r\n.cgc-vc .cgc-error strong { color: #7F1D1D; }\r\n\r\n\/* Info modo *\/\r\n.cgc-vc .cgc-mode-info {\r\n  background: rgba(59,130,246,0.06);\r\n  border: 1px solid rgba(59,130,246,0.2);\r\n  border-radius: 7px;\r\n  padding: 10px 12px;\r\n  margin-bottom: 12px;\r\n  font-size: 12px;\r\n  color: #1E40AF;\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: 8px;\r\n}\r\n.cgc-vc .cgc-mode-info .ti { font-size: 14px; flex-shrink: 0; margin-top: 2px; }\r\n.cgc-vc .cgc-mode-info strong { color: #1E3A8A; }\r\n\r\n\/* Bloque protegido *\/\r\n.cgc-vc .cgc-protected {\r\n  position: relative; background: #F9FAFB; border: 1px solid #E5E7EB;\r\n  border-radius: 10px; padding: 18px; overflow: hidden; margin-top: 14px;\r\n}\r\n.cgc-vc .cgc-no-copy {\r\n  user-select: none; -webkit-user-select: none;\r\n  position: relative; z-index: 1;\r\n}\r\n.cgc-vc .cgc-wm {\r\n  position: absolute; inset: 0; overflow: hidden; pointer-events: none;\r\n  border-radius: 10px;\r\n}\r\n.cgc-vc .cgc-wm-tile {\r\n  position: absolute; display: flex; align-items: center; gap: 5px;\r\n  opacity: 0.07; transform: rotate(-22deg); white-space: nowrap;\r\n  font-size: 10px; font-weight: 500; color: #0F3D3A;\r\n}\r\n\r\n.cgc-vc .cgc-protected-header {\r\n  display: flex; align-items: center; justify-content: space-between;\r\n  margin-bottom: 14px;\r\n}\r\n.cgc-vc .cgc-protected-title {\r\n  font-size: 12px; color: #6B7280; text-transform: uppercase;\r\n  letter-spacing: 0.5px; font-weight: 500;\r\n}\r\n.cgc-vc .cgc-status {\r\n  display: inline-block; padding: 4px 10px; border-radius: 999px;\r\n  font-size: 11px; font-weight: 500;\r\n  background: rgba(34,165,89,0.12); color: #0F6E3D;\r\n}\r\n\r\n\/* Cards resumen *\/\r\n.cgc-vc .cgc-cards-grid {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 10px;\r\n  margin-bottom: 14px;\r\n}\r\n.cgc-vc .cgc-card {\r\n  background: #ffffff;\r\n  border: 1px solid #E5E7EB;\r\n  border-radius: 8px;\r\n  padding: 12px 14px;\r\n}\r\n.cgc-vc .cgc-card-label {\r\n  font-size: 11px;\r\n  color: #6B7280;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 4px;\r\n}\r\n.cgc-vc .cgc-card-val {\r\n  font-size: 17px;\r\n  font-weight: 500;\r\n  color: #0F3D3A;\r\n  font-variant-numeric: tabular-nums;\r\n}\r\n\r\n\/* Filas *\/\r\n.cgc-vc .cgc-row {\r\n  display: flex; align-items: center; justify-content: space-between;\r\n  padding: 6px 0; font-size: 13px;\r\n}\r\n.cgc-vc .cgc-row-label { color: #4B5563; }\r\n.cgc-vc .cgc-row-val { color: #111827; font-weight: 500; font-variant-numeric: tabular-nums; }\r\n.cgc-vc .cgc-subtotal {\r\n  border-top: 1px dashed #D1D5DB; margin-top: 8px; padding-top: 10px;\r\n  display: flex; justify-content: space-between;\r\n  font-size: 14px; font-weight: 500; color: #0F3D3A;\r\n}\r\n\r\n\/* Triple desglose *\/\r\n.cgc-vc .cgc-triple-row {\r\n  display: flex; align-items: flex-start; justify-content: space-between;\r\n  padding: 8px 0; font-size: 13px;\r\n  border-bottom: 1px solid #F3F4F6;\r\n}\r\n.cgc-vc .cgc-triple-row:last-child { border-bottom: none; }\r\n.cgc-vc .cgc-triple-num {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 20px; height: 20px;\r\n  border-radius: 50%;\r\n  background: #0F3D3A;\r\n  color: #ffffff;\r\n  font-size: 11px;\r\n  font-weight: 500;\r\n  flex-shrink: 0;\r\n  margin-right: 8px;\r\n}\r\n.cgc-vc .cgc-triple-label-block { flex: 1; }\r\n.cgc-vc .cgc-triple-label-block .main {\r\n  color: #111827; font-weight: 500; margin-bottom: 2px;\r\n}\r\n.cgc-vc .cgc-triple-label-block .sub {\r\n  color: #6B7280; font-size: 11px;\r\n}\r\n\r\n\/* Total final *\/\r\n.cgc-vc .cgc-total-box {\r\n  margin-top: 16px; padding: 14px 16px;\r\n  background: #0F3D3A; border-radius: 10px;\r\n  display: flex; align-items: center; justify-content: space-between;\r\n}\r\n.cgc-vc .cgc-total-label {\r\n  font-size: 11px; color: rgba(255,255,255,0.65);\r\n  text-transform: uppercase; letter-spacing: 1px; margin-bottom: 2px;\r\n}\r\n.cgc-vc .cgc-total-sub {\r\n  font-size: 11px; color: rgba(255,255,255,0.75);\r\n}\r\n.cgc-vc .cgc-total-val {\r\n  font-size: 28px; font-weight: 500; color: #ffffff; line-height: 1;\r\n}\r\n\r\n\/* Legal info *\/\r\n.cgc-vc .cgc-legal {\r\n  margin-top: 14px; padding: 12px 14px;\r\n  background: rgba(59,130,246,0.06); border: 1px solid rgba(59,130,246,0.2);\r\n  border-radius: 7px; font-size: 11px; color: #1E40AF;\r\n  display: flex; align-items: flex-start; gap: 8px;\r\n}\r\n.cgc-vc .cgc-legal .ti { font-size: 14px; flex-shrink: 0; margin-top: 1px; }\r\n.cgc-vc .cgc-legal strong { color: #1E3A8A; }\r\n\r\n\/* Botones *\/\r\n.cgc-vc .cgc-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }\r\n.cgc-vc .cgc-btn {\r\n  flex: 1; min-width: 130px; padding: 10px 14px;\r\n  border-radius: 8px; font-size: 14px; font-weight: 500;\r\n  cursor: pointer; display: inline-flex; align-items: center;\r\n  justify-content: center; gap: 6px; border: 1px solid;\r\n  transition: all 0.15s;\r\n}\r\n.cgc-vc .cgc-btn-secondary { background: #ffffff; border-color: #D1D5DB; color: #374151; }\r\n.cgc-vc .cgc-btn-secondary:hover { background: #F9FAFB; }\r\n.cgc-vc .cgc-btn-primary { background: #22A559; border-color: #22A559; color: #ffffff; }\r\n.cgc-vc .cgc-btn-primary:hover { background: #1E8E4D; border-color: #1E8E4D; }\r\n.cgc-vc .cgc-btn .ti { font-size: 16px; }\r\n\r\n\/* Footer *\/\r\n.cgc-vc .cgc-footer {\r\n  margin-top: 14px; padding-top: 12px;\r\n  border-top: 1px solid #E5E7EB;\r\n  display: flex; align-items: center; justify-content: space-between;\r\n  flex-wrap: wrap; gap: 8px;\r\n}\r\n.cgc-vc .cgc-footer-left { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #9CA3AF; }\r\n.cgc-vc .cgc-footer-left .ti { font-size: 14px; color: #22A559; }\r\n.cgc-vc .cgc-footer-right { font-size: 11px; color: #6B7280; font-weight: 500; }\r\n\r\n@media (max-width: 600px) {\r\n  .cgc-vc .cgc-grid-2,\r\n  .cgc-vc .cgc-grid-3,\r\n  .cgc-vc .cgc-cards-grid { grid-template-columns: 1fr !important; }\r\n  .cgc-vc .cgc-mode-btn span { display: none; }\r\n  .cgc-vc .cgc-mode-btn .ti { font-size: 16px; }\r\n  .cgc-vc .cgc-header-title-block {\r\n    border-left: none; padding-left: 0;\r\n    border-top: 1px solid rgba(255,255,255,0.2);\r\n    padding-top: 12px; margin-top: 4px; width: 100%;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<!-- Header -->\r\n<div class=\"cgc-header\">\r\n  <div class=\"cgc-header-left\">\r\n    <img decoding=\"async\" src=\"https:\/\/cgestiona.com\/wp-content\/uploads\/2026\/05\/logo-c-gestiona-blanco-transparente.png\"\r\n         alt=\"C Gestiona\" class=\"cgc-logo\" \/>\r\n    <div class=\"cgc-header-title-block\">\r\n      <div class=\"cgc-header-eyebrow\">Calculadora<\/div>\r\n      <h2 class=\"cgc-header-title\">Vacaciones de Planilla<\/h2>\r\n    <\/div>\r\n  <\/div>\r\n  <div class=\"cgc-pill\">\r\n    <i class=\"ti ti-lock\"><\/i>\r\n    <span>Acceso registrado<\/span>\r\n  <\/div>\r\n<\/div>\r\n\r\n<div class=\"cgc-body\">\r\n\r\n  <p class=\"cgc-intro\">\r\n    <i class=\"ti ti-info-circle\"><\/i>\r\n    Calcula tus vacaciones ganadas, truncas o el triple vacacional seg\u00fan el r\u00e9gimen laboral (D.L. 713).\r\n  <\/p>\r\n\r\n  <!-- Toggle modo -->\r\n  <div class=\"cgc-mode-toggle\">\r\n    <button type=\"button\" class=\"cgc-mode-btn active\" data-mode=\"ganadas\">\r\n      <i class=\"ti ti-beach\"><\/i> <span>Ganadas<\/span>\r\n    <\/button>\r\n    <button type=\"button\" class=\"cgc-mode-btn\" data-mode=\"truncas\">\r\n      <i class=\"ti ti-clock-stop\"><\/i> <span>Truncas<\/span>\r\n    <\/button>\r\n    <button type=\"button\" class=\"cgc-mode-btn\" data-mode=\"triple\">\r\n      <i class=\"ti ti-x\"><\/i> <span>Triple Vacacional<\/span>\r\n    <\/button>\r\n  <\/div>\r\n\r\n  <!-- Info seg\u00fan modo -->\r\n  <div class=\"cgc-mode-info\" id=\"cgc-modeInfo\">\r\n    <i class=\"ti ti-bulb\"><\/i>\r\n    <div id=\"cgc-modeInfoText\">\r\n      <strong>Vacaciones ganadas:<\/strong> Calcula los d\u00edas disponibles despu\u00e9s de cumplir un a\u00f1o completo de servicios.\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- A. Datos del trabajador -->\r\n  <div class=\"cgc-section\">\r\n    <h3 class=\"cgc-section-title\"><span class=\"cgc-letter\">A<\/span> Datos del trabajador<\/h3>\r\n\r\n    <div class=\"cgc-grid-2\" style=\"margin-bottom: 12px;\">\r\n      <div>\r\n        <label class=\"cgc-label\" for=\"cgc-fIngreso\">Fecha de ingreso<\/label>\r\n        <input type=\"date\" id=\"cgc-fIngreso\" class=\"cgc-input\" value=\"2024-01-31\" \/>\r\n      <\/div>\r\n      <div>\r\n        <label class=\"cgc-label\" for=\"cgc-fSalida\" id=\"cgc-labelSalida\">Fecha de salida o consulta<\/label>\r\n        <input type=\"date\" id=\"cgc-fSalida\" class=\"cgc-input\" value=\"2026-05-13\" \/>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"cgc-grid-2\">\r\n      <div>\r\n        <label class=\"cgc-label\" for=\"cgc-sueldo\">Sueldo mensual<\/label>\r\n        <div class=\"cgc-input-prefix\">\r\n          <span>S\/<\/span>\r\n          <input type=\"number\" id=\"cgc-sueldo\" class=\"cgc-input\" value=\"2000\" min=\"0\" step=\"0.01\" \/>\r\n        <\/div>\r\n      <\/div>\r\n      <div>\r\n        <label class=\"cgc-label\" for=\"cgc-regimen\">R\u00e9gimen laboral<\/label>\r\n        <select id=\"cgc-regimen\" class=\"cgc-select\">\r\n          <option value=\"general\" selected>R\u00e9gimen General (30 d\u00edas\/a\u00f1o)<\/option>\r\n          <option value=\"pequena\">Peque\u00f1a Empresa (15 d\u00edas\/a\u00f1o)<\/option>\r\n          <option value=\"micro\">Microempresa REMYPE (15 d\u00edas\/a\u00f1o)<\/option>\r\n        <\/select>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Solo para ganadas -->\r\n    <div id=\"cgc-rowDiasTomados\" style=\"margin-top: 12px;\">\r\n      <label class=\"cgc-label\" for=\"cgc-diasTomados\">D\u00edas de vacaciones ya tomados (opcional)<\/label>\r\n      <input type=\"number\" id=\"cgc-diasTomados\" class=\"cgc-input\" value=\"0\" min=\"0\" step=\"1\" style=\"max-width: 160px;\" \/>\r\n    <\/div>\r\n\r\n    <div class=\"cgc-banner\" id=\"cgc-bannerPeriodo\">\r\n      <i class=\"ti ti-clock\"><\/i>\r\n      <span>Tiempo de servicios: 2 a\u00f1os 3 meses 12 d\u00edas<\/span>\r\n    <\/div>\r\n\r\n    <div class=\"cgc-error hidden\" id=\"cgc-errFechas\">\r\n      <i class=\"ti ti-alert-circle\"><\/i>\r\n      <div>\r\n        <strong>Verifica las fechas<\/strong><br>\r\n        <span id=\"cgc-errFechasMsg\"><\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"cgc-error hidden\" id=\"cgc-errRecord\">\r\n      <i class=\"ti ti-alert-circle\"><\/i>\r\n      <div>\r\n        <strong>No cumple r\u00e9cord vacacional<\/strong><br>\r\n        Para vacaciones ganadas se requiere haber cumplido al menos 1 a\u00f1o completo de servicios. Considera usar el modo \"Truncas\".\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- Resultados protegidos -->\r\n  <div class=\"cgc-protected\">\r\n    <div class=\"cgc-wm\" id=\"cgc-wm-bg\" aria-hidden=\"true\"><\/div>\r\n    <div class=\"cgc-no-copy\">\r\n\r\n      <div class=\"cgc-protected-header\">\r\n        <span class=\"cgc-protected-title\" id=\"cgc-resultTitle\">Vacaciones ganadas<\/span>\r\n        <span class=\"cgc-status\" id=\"cgc-statusBadge\">Calculado<\/span>\r\n      <\/div>\r\n\r\n      <!-- Cards de resumen -->\r\n      <div class=\"cgc-cards-grid\" id=\"cgc-cardsGrid\">\r\n        <!-- Generadas por JS -->\r\n      <\/div>\r\n\r\n      <!-- Detalle seg\u00fan modo -->\r\n      <div id=\"cgc-detalleGanadas\">\r\n        <div class=\"cgc-row\"><span class=\"cgc-row-label\">D\u00edas ganados por a\u00f1o completo<\/span><span class=\"cgc-row-val\" id=\"cgc-diasAnioVal\">30 d\u00edas<\/span><\/div>\r\n        <div class=\"cgc-row\"><span class=\"cgc-row-label\">A\u00f1os completos<\/span><span class=\"cgc-row-val\" id=\"cgc-aniosCompletosVal\">2 a\u00f1os<\/span><\/div>\r\n        <div class=\"cgc-row\"><span class=\"cgc-row-label\">D\u00edas ya tomados<\/span><span class=\"cgc-row-val\" id=\"cgc-tomadosVal\">0 d\u00edas<\/span><\/div>\r\n        <div class=\"cgc-subtotal\"><span>D\u00edas pendientes<\/span><span id=\"cgc-pendientesVal\">60 d\u00edas<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div id=\"cgc-detalleTruncas\" style=\"display: none;\">\r\n        <div class=\"cgc-row\"><span class=\"cgc-row-label\">Per\u00edodo fraccional (no complet\u00f3 1 a\u00f1o)<\/span><span class=\"cgc-row-val\" id=\"cgc-truncaPeriodo\">3 meses 12 d\u00edas<\/span><\/div>\r\n        <div class=\"cgc-row\"><span class=\"cgc-row-label\">D\u00edas de vacaciones truncas<\/span><span class=\"cgc-row-val\" id=\"cgc-truncaDias\">8.50 d\u00edas<\/span><\/div>\r\n        <div class=\"cgc-row\"><span class=\"cgc-row-label\">Sueldo \/ 12 \u00d7 meses<\/span><span class=\"cgc-row-val\" id=\"cgc-truncaMeses\">S\/ 500.00<\/span><\/div>\r\n        <div class=\"cgc-row\"><span class=\"cgc-row-label\">Sueldo \/ 360 \u00d7 d\u00edas<\/span><span class=\"cgc-row-val\" id=\"cgc-truncaDiasMonto\">S\/ 66.67<\/span><\/div>\r\n        <div class=\"cgc-subtotal\"><span>Subtotal vacaciones truncas<\/span><span id=\"cgc-truncaSubtotal\">S\/ 566.67<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div id=\"cgc-detalleTriple\" style=\"display: none;\">\r\n        <div class=\"cgc-triple-row\">\r\n          <div style=\"display: flex;\">\r\n            <span class=\"cgc-triple-num\">1<\/span>\r\n            <div class=\"cgc-triple-label-block\">\r\n              <div class=\"main\">Vacaciones no gozadas<\/div>\r\n              <div class=\"sub\">Pago del descanso vacacional adquirido (Art. 23 DL 713)<\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <span class=\"cgc-row-val\" id=\"cgc-triple1\">S\/ 2,000.00<\/span>\r\n        <\/div>\r\n        <div class=\"cgc-triple-row\">\r\n          <div style=\"display: flex;\">\r\n            <span class=\"cgc-triple-num\">2<\/span>\r\n            <div class=\"cgc-triple-label-block\">\r\n              <div class=\"main\">Indemnizaci\u00f3n vacacional<\/div>\r\n              <div class=\"sub\">Por no haber disfrutado el descanso (sanci\u00f3n al empleador)<\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <span class=\"cgc-row-val\" id=\"cgc-triple2\">S\/ 2,000.00<\/span>\r\n        <\/div>\r\n        <div class=\"cgc-triple-row\">\r\n          <div style=\"display: flex;\">\r\n            <span class=\"cgc-triple-num\">3<\/span>\r\n            <div class=\"cgc-triple-label-block\">\r\n              <div class=\"main\">Remuneraci\u00f3n del mes<\/div>\r\n              <div class=\"sub\">Ya pagada como sueldo regular (incluida solo en el c\u00e1lculo)<\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <span class=\"cgc-row-val\" id=\"cgc-triple3\">S\/ 2,000.00<\/span>\r\n        <\/div>\r\n        <div class=\"cgc-subtotal\"><span>Total triple vacacional<\/span><span id=\"cgc-tripleTotal\">S\/ 6,000.00<\/span><\/div>\r\n        <p style=\"margin-top: 8px; font-size: 11px; color: #6B7280; font-style: italic;\">\r\n          La indemnizaci\u00f3n (concepto 2) NO est\u00e1 afecta a tributos seg\u00fan Art. 23 DL 713.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <!-- Total -->\r\n      <div class=\"cgc-total-box\">\r\n        <div>\r\n          <div class=\"cgc-total-label\" id=\"cgc-totalLabel\">Total a recibir<\/div>\r\n          <div class=\"cgc-total-sub\" id=\"cgc-totalSub\">Vacaciones ganadas<\/div>\r\n        <\/div>\r\n        <div class=\"cgc-total-val\" id=\"cgc-totalFinal\">S\/ 4,000.00<\/div>\r\n      <\/div>\r\n\r\n      <!-- Legal -->\r\n      <div class=\"cgc-legal\">\r\n        <i class=\"ti ti-scale\"><\/i>\r\n        <div>\r\n          <strong>Base legal:<\/strong> D.L. 713 y su reglamento D.S. 012-92-TR. Aplica al r\u00e9gimen laboral privado. Esta calculadora es referencial; para casos especiales (partime, sindicalizaci\u00f3n, embarazos) consulte con un abogado laboralista.\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- Botones -->\r\n  <div class=\"cgc-actions\">\r\n    <button type=\"button\" id=\"cgc-btn-reset\" class=\"cgc-btn cgc-btn-secondary\">\r\n      <i class=\"ti ti-refresh\"><\/i> Limpiar\r\n    <\/button>\r\n    <button type=\"button\" id=\"cgc-btn-copy\" class=\"cgc-btn cgc-btn-primary\">\r\n      <i class=\"ti ti-clipboard\"><\/i> Copiar resumen\r\n    <\/button>\r\n  <\/div>\r\n\r\n  <!-- Footer -->\r\n  <div class=\"cgc-footer\">\r\n    <div class=\"cgc-footer-left\">\r\n      <i class=\"ti ti-shield-check\"><\/i>\r\n      <span>Contenido protegido \u00b7 No descargable<\/span>\r\n    <\/div>\r\n    <span class=\"cgc-footer-right\">cgestiona.com \u00b7 contacto@cgestiona.com<\/span>\r\n  <\/div>\r\n\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n  var USER_EMAIL = 'contacto@cgestiona.com';\r\n  var BRAND_EMAIL = 'contacto@cgestiona.com';\r\n\r\n  var $ = function(id) { return document.getElementById(id); };\r\n  var currentMode = 'ganadas';\r\n\r\n  \/\/ D\u00edas por r\u00e9gimen\r\n  var REGIMENES = {\r\n    'general':  { dias: 30, nombre: 'R\u00e9gimen General' },\r\n    'pequena':  { dias: 15, nombre: 'Peque\u00f1a Empresa' },\r\n    'micro':    { dias: 15, nombre: 'Microempresa REMYPE' }\r\n  };\r\n\r\n  var MODE_INFO = {\r\n    'ganadas': '<strong>Vacaciones ganadas:<\/strong> Calcula los d\u00edas disponibles despu\u00e9s de cumplir un a\u00f1o completo de servicios. Resta los d\u00edas ya tomados para obtener el saldo pendiente.',\r\n    'truncas': '<strong>Vacaciones truncas:<\/strong> Para trabajadores que cesan antes de cumplir el a\u00f1o o desean conocer el monto proporcional del per\u00edodo fraccional. F\u00f3rmula: (sueldo \u00f7 12) \u00d7 meses + (sueldo \u00f7 360) \u00d7 d\u00edas.',\r\n    'triple': '<strong>Triple vacacional:<\/strong> Sanci\u00f3n al empleador cuando un trabajador con r\u00e9cord vacacional cumplido NO goz\u00f3 sus 30 d\u00edas en el a\u00f1o siguiente. Equivale a 3 remuneraciones (Art. 23 D.L. 713).'\r\n  };\r\n\r\n  function fmt(n) {\r\n    return 'S\/ ' + n.toLocaleString('es-PE', {minimumFractionDigits: 2, maximumFractionDigits: 2});\r\n  }\r\n  function fmtDias(n) {\r\n    return n.toLocaleString('es-PE', {minimumFractionDigits: 0, maximumFractionDigits: 2}) + ' d\u00edas';\r\n  }\r\n\r\n  function buildWatermark() {\r\n    var wm = $('cgc-wm-bg');\r\n    if (!wm) return;\r\n    wm.innerHTML = '';\r\n    for (var r = 0; r < 8; r++) {\r\n      for (var c = 0; c < 4; c++) {\r\n        var tile = document.createElement('div');\r\n        tile.className = 'cgc-wm-tile';\r\n        tile.style.left = (c * 28 - 5) + '%';\r\n        tile.style.top = (r * 14 - 5) + '%';\r\n        var email = (r + c) % 2 === 0 ? USER_EMAIL : BRAND_EMAIL;\r\n        tile.innerHTML =\r\n          '<svg width=\"14\" height=\"14\" viewBox=\"0 0 200 100\">' +\r\n            '<g fill=\"none\" stroke=\"#0F3D3A\" stroke-width=\"11\" stroke-linecap=\"round\">' +\r\n              '<path d=\"M 60 25 Q 25 25 25 55 Q 25 85 60 85 Q 78 85 88 75\"\/>' +\r\n              '<path d=\"M 140 85 Q 175 85 175 55 Q 175 25 140 25 Q 122 25 112 35\"\/>' +\r\n            '<\/g>' +\r\n            '<line x1=\"35\" y1=\"85\" x2=\"170\" y2=\"15\" stroke=\"#0F3D3A\" stroke-width=\"8\" stroke-linecap=\"round\"\/>' +\r\n          '<\/svg>' +\r\n          '<span>C Gestiona \u00b7 ' + email + '<\/span>';\r\n        wm.appendChild(tile);\r\n      }\r\n    }\r\n  }\r\n\r\n  function days360(start, end) {\r\n    var d1 = start.getDate(), m1 = start.getMonth()+1, y1 = start.getFullYear();\r\n    var d2 = end.getDate(), m2 = end.getMonth()+1, y2 = end.getFullYear();\r\n    if (d1 === 31) d1 = 30;\r\n    if (d2 === 31 && d1 >= 30) d2 = 30;\r\n    return (y2-y1)*360 + (m2-m1)*30 + (d2-d1);\r\n  }\r\n\r\n  function hideError(id) { $(id).classList.add('hidden'); }\r\n  function showError(id, msg) {\r\n    var el = $(id);\r\n    el.classList.remove('hidden');\r\n    if (msg) {\r\n      var msgEl = el.querySelector('#cgc-errFechasMsg');\r\n      if (msgEl) msgEl.textContent = msg;\r\n    }\r\n  }\r\n\r\n  function renderCardsGanadas(anios, totalDias, tomados, pendientes, montoPendiente) {\r\n    var html = '';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Tiempo de servicios<\/div><div class=\"cgc-card-val\">' + anios + ' a\u00f1os<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">D\u00edas ganados totales<\/div><div class=\"cgc-card-val\">' + totalDias + ' d\u00edas<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Saldo pendiente<\/div><div class=\"cgc-card-val\">' + pendientes + ' d\u00edas<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Monto a pagar<\/div><div class=\"cgc-card-val\">' + fmt(montoPendiente) + '<\/div><\/div>';\r\n    $('cgc-cardsGrid').innerHTML = html;\r\n  }\r\n\r\n  function renderCardsTruncas(meses, dias, diasTruncas, monto) {\r\n    var html = '';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Per\u00edodo<\/div><div class=\"cgc-card-val\">' + meses + ' m ' + dias + ' d<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">D\u00edas truncas equivalentes<\/div><div class=\"cgc-card-val\">' + diasTruncas.toFixed(2) + ' d\u00edas<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Monto trunco<\/div><div class=\"cgc-card-val\">' + fmt(monto) + '<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Total liquidaci\u00f3n<\/div><div class=\"cgc-card-val\">' + fmt(monto) + '<\/div><\/div>';\r\n    $('cgc-cardsGrid').innerHTML = html;\r\n  }\r\n\r\n  function renderCardsTriple(sueldo) {\r\n    var html = '';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Sueldo base<\/div><div class=\"cgc-card-val\">' + fmt(sueldo) + '<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Concepto 1 + 2<\/div><div class=\"cgc-card-val\">' + fmt(sueldo * 2) + '<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Concepto 3 (ya pagado)<\/div><div class=\"cgc-card-val\">' + fmt(sueldo) + '<\/div><\/div>';\r\n    html += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Total a percibir adicional<\/div><div class=\"cgc-card-val\">' + fmt(sueldo * 2) + '<\/div><\/div>';\r\n    $('cgc-cardsGrid').innerHTML = html;\r\n  }\r\n\r\n  function calcular() {\r\n    hideError('cgc-errFechas');\r\n    hideError('cgc-errRecord');\r\n\r\n    var fIng = $('cgc-fIngreso').value ? new Date($('cgc-fIngreso').value + 'T00:00:00') : null;\r\n    var fSal = $('cgc-fSalida').value ? new Date($('cgc-fSalida').value + 'T00:00:00') : null;\r\n    var sueldo = parseFloat($('cgc-sueldo').value) || 0;\r\n    var regKey = $('cgc-regimen').value;\r\n    var reg = REGIMENES[regKey];\r\n\r\n    if (!fIng || !fSal) {\r\n      showError('cgc-errFechas', 'Ingresa la fecha de ingreso y la fecha de salida o consulta.');\r\n      return;\r\n    }\r\n    if (fSal < fIng) {\r\n      showError('cgc-errFechas', 'La fecha de salida no puede ser anterior a la de ingreso.');\r\n      return;\r\n    }\r\n\r\n    \/\/ Per\u00edodo total\r\n    var totalDias360 = days360(fIng, fSal);\r\n    var anios = Math.floor(totalDias360 \/ 360);\r\n    var resto = totalDias360 % 360;\r\n    var meses = Math.floor(resto \/ 30);\r\n    var dias = resto % 30;\r\n    $('cgc-bannerPeriodo').innerHTML = '<i class=\"ti ti-clock\"><\/i> <span>Tiempo de servicios: ' +\r\n      anios + ' a\u00f1os ' + meses + ' meses ' + dias + ' d\u00edas<\/span>';\r\n\r\n    if (currentMode === 'ganadas') {\r\n      $('cgc-resultTitle').textContent = 'Vacaciones ganadas';\r\n      $('cgc-totalLabel').textContent = 'Total a pagar (pendientes)';\r\n      $('cgc-totalSub').textContent = 'Vacaciones ganadas \u00b7 ' + reg.nombre;\r\n      $('cgc-detalleGanadas').style.display = '';\r\n      $('cgc-detalleTruncas').style.display = 'none';\r\n      $('cgc-detalleTriple').style.display = 'none';\r\n\r\n      if (anios < 1) {\r\n        showError('cgc-errRecord');\r\n        renderCardsGanadas(0, 0, 0, 0, 0);\r\n        $('cgc-diasAnioVal').textContent = reg.dias + ' d\u00edas';\r\n        $('cgc-aniosCompletosVal').textContent = '0 a\u00f1os';\r\n        $('cgc-tomadosVal').textContent = '0 d\u00edas';\r\n        $('cgc-pendientesVal').textContent = '0 d\u00edas';\r\n        $('cgc-totalFinal').textContent = fmt(0);\r\n        return;\r\n      }\r\n\r\n      var totalDiasGanados = anios * reg.dias;\r\n      var tomados = parseInt($('cgc-diasTomados').value) || 0;\r\n      var pendientes = Math.max(0, totalDiasGanados - tomados);\r\n      var montoPendiente = sueldo \/ 30 * pendientes;\r\n\r\n      $('cgc-diasAnioVal').textContent = reg.dias + ' d\u00edas';\r\n      $('cgc-aniosCompletosVal').textContent = anios + (anios === 1 ? ' a\u00f1o' : ' a\u00f1os');\r\n      $('cgc-tomadosVal').textContent = tomados + ' d\u00edas';\r\n      $('cgc-pendientesVal').textContent = pendientes + ' d\u00edas';\r\n      $('cgc-totalFinal').textContent = fmt(montoPendiente);\r\n\r\n      renderCardsGanadas(anios, totalDiasGanados, tomados, pendientes, montoPendiente);\r\n\r\n    } else if (currentMode === 'truncas') {\r\n      $('cgc-resultTitle').textContent = 'Vacaciones truncas';\r\n      $('cgc-totalLabel').textContent = 'Monto trunco a pagar';\r\n      $('cgc-totalSub').textContent = 'Vacaciones truncas \u00b7 ' + reg.nombre;\r\n      $('cgc-detalleGanadas').style.display = 'none';\r\n      $('cgc-detalleTruncas').style.display = '';\r\n      $('cgc-detalleTriple').style.display = 'none';\r\n\r\n      \/\/ Las truncas se calculan sobre el per\u00edodo fraccional (residual)\r\n      \/\/ o sobre todo el per\u00edodo si no hay a\u00f1o completo\r\n      var mesesUsar, diasUsar;\r\n      if (anios > 0) {\r\n        \/\/ Hay a\u00f1os completos + per\u00edodo fraccional - solo el fraccional cuenta como trunco\r\n        mesesUsar = meses;\r\n        diasUsar = dias;\r\n      } else {\r\n        mesesUsar = meses;\r\n        diasUsar = dias;\r\n      }\r\n\r\n      \/\/ Factor del r\u00e9gimen: 30 d\u00edas \u2192 factor 1, 15 d\u00edas \u2192 factor 0.5\r\n      var factor = reg.dias \/ 30;\r\n      \/\/ D\u00edas truncas equivalentes\r\n      var diasTruncas = (reg.dias \/ 12 * mesesUsar) + (reg.dias \/ 360 * diasUsar);\r\n      \/\/ Monto trunco: (sueldo\/12 \u00d7 meses) + (sueldo\/360 \u00d7 d\u00edas), ajustado por factor\r\n      var truncaMeses = sueldo \/ 12 * mesesUsar * factor;\r\n      var truncaDiasMonto = sueldo \/ 360 * diasUsar * factor;\r\n      var truncaSubtotal = truncaMeses + truncaDiasMonto;\r\n\r\n      $('cgc-truncaPeriodo').textContent = mesesUsar + ' meses ' + diasUsar + ' d\u00edas';\r\n      $('cgc-truncaDias').textContent = diasTruncas.toFixed(2) + ' d\u00edas';\r\n      $('cgc-truncaMeses').textContent = fmt(truncaMeses);\r\n      $('cgc-truncaDiasMonto').textContent = fmt(truncaDiasMonto);\r\n      $('cgc-truncaSubtotal').textContent = fmt(truncaSubtotal);\r\n      $('cgc-totalFinal').textContent = fmt(truncaSubtotal);\r\n\r\n      renderCardsTruncas(mesesUsar, diasUsar, diasTruncas, truncaSubtotal);\r\n\r\n    } else if (currentMode === 'triple') {\r\n      $('cgc-resultTitle').textContent = 'Triple vacacional';\r\n      $('cgc-totalLabel').textContent = 'Total triple vacacional';\r\n      $('cgc-totalSub').textContent = 'Indemnizaci\u00f3n Art. 23 D.L. 713';\r\n      $('cgc-detalleGanadas').style.display = 'none';\r\n      $('cgc-detalleTruncas').style.display = 'none';\r\n      $('cgc-detalleTriple').style.display = '';\r\n\r\n      \/\/ El triple solo aplica si cumpli\u00f3 r\u00e9cord (1 a\u00f1o) + no goz\u00f3 + pas\u00f3 otro a\u00f1o\r\n      if (anios < 2) {\r\n        showError('cgc-errRecord', 'Para triple vacacional se requiere haber completado el r\u00e9cord (1 a\u00f1o) y que haya transcurrido otro a\u00f1o sin gozar las vacaciones.');\r\n      }\r\n\r\n      $('cgc-triple1').textContent = fmt(sueldo);\r\n      $('cgc-triple2').textContent = fmt(sueldo);\r\n      $('cgc-triple3').textContent = fmt(sueldo);\r\n      $('cgc-tripleTotal').textContent = fmt(sueldo * 3);\r\n      $('cgc-totalFinal').textContent = fmt(sueldo * 3);\r\n\r\n      renderCardsTriple(sueldo);\r\n    }\r\n  }\r\n\r\n  \/\/ Toggle modo\r\n  document.querySelectorAll('.cgc-mode-btn').forEach(function(btn) {\r\n    btn.addEventListener('click', function() {\r\n      document.querySelectorAll('.cgc-mode-btn').forEach(function(b) {\r\n        b.classList.remove('active');\r\n      });\r\n      this.classList.add('active');\r\n      currentMode = this.getAttribute('data-mode');\r\n      $('cgc-modeInfoText').innerHTML = MODE_INFO[currentMode];\r\n\r\n      \/\/ Ajustar label de fecha\r\n      var labelSalida = $('cgc-labelSalida');\r\n      var rowTomados = $('cgc-rowDiasTomados');\r\n      if (currentMode === 'ganadas') {\r\n        labelSalida.textContent = 'Fecha de consulta (hoy)';\r\n        rowTomados.style.display = '';\r\n      } else if (currentMode === 'truncas') {\r\n        labelSalida.textContent = 'Fecha de salida (cese)';\r\n        rowTomados.style.display = 'none';\r\n      } else {\r\n        labelSalida.textContent = 'Fecha actual';\r\n        rowTomados.style.display = 'none';\r\n      }\r\n\r\n      calcular();\r\n    });\r\n  });\r\n\r\n  \/\/ Listeners\r\n  ['cgc-fIngreso','cgc-fSalida','cgc-sueldo','cgc-regimen','cgc-diasTomados'].forEach(function(id) {\r\n    $(id).addEventListener('input', calcular);\r\n    $(id).addEventListener('change', calcular);\r\n  });\r\n\r\n  $('cgc-btn-reset').addEventListener('click', function() {\r\n    $('cgc-fIngreso').value = '';\r\n    $('cgc-fSalida').value = '';\r\n    $('cgc-sueldo').value = '';\r\n    $('cgc-diasTomados').value = '0';\r\n    $('cgc-regimen').value = 'general';\r\n    calcular();\r\n  });\r\n\r\n  $('cgc-btn-copy').addEventListener('click', function(e) {\r\n    var reg = REGIMENES[$('cgc-regimen').value];\r\n    var modoNombre = currentMode === 'ganadas' ? 'Vacaciones ganadas' :\r\n                     currentMode === 'truncas' ? 'Vacaciones truncas' : 'Triple vacacional';\r\n    var txt = 'Vacaciones \u2014 C Gestiona\\n';\r\n    txt += 'Modo: ' + modoNombre + '\\n';\r\n    txt += 'R\u00e9gimen: ' + reg.nombre + '\\n';\r\n    txt += 'Total: ' + $('cgc-totalFinal').textContent + '\\n\\n';\r\n    txt += 'Base legal: D.L. 713 \/ D.S. 012-92-TR\\n\\n';\r\n    txt += 'M\u00e1s calculadoras en cgestiona.com';\r\n    if (navigator.clipboard) navigator.clipboard.writeText(txt);\r\n    var b = e.currentTarget;\r\n    var orig = b.innerHTML;\r\n    b.innerHTML = '<i class=\"ti ti-check\"><\/i> Copiado';\r\n    setTimeout(function() { b.innerHTML = orig; }, 1500);\r\n  });\r\n\r\n  document.addEventListener('contextmenu', function(e) {\r\n    if (e.target.closest && e.target.closest('.cgc-no-copy')) e.preventDefault();\r\n  });\r\n\r\n  buildWatermark();\r\n  calcular();\r\n})();\r\n<\/script>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Calculadora de Vacaciones de Planilla Calcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado. Calculadora Vacaciones de Planilla Acceso registrado Calcula tus vacaciones ganadas, truncas o el triple vacacional seg\u00fan el r\u00e9gimen laboral (D.L. 713). Ganadas Truncas Triple Vacacional Vacaciones ganadas: Calcula los&#8230;<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"content-type":"","inline_featured_image":false,"footnotes":""},"class_list":["post-988714","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Calculadora de vacaciones de planilla en Per\u00fa - C Gestiona<\/title>\n<meta name=\"description\" content=\"Calcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cgestiona.com\/en\/calculadora-vacaciones-planilla\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Calculadora de vacaciones de planilla en Per\u00fa - C Gestiona\" \/>\n<meta property=\"og:description\" content=\"Calcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cgestiona.com\/en\/calculadora-vacaciones-planilla\/\" \/>\n<meta property=\"og:site_name\" content=\"C Gestiona\" \/>\n<meta property=\"article:modified_time\" content=\"2026-05-14T04:19:13+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cgestiona.com\/wp-content\/uploads\/2026\/05\/logo-c-gestiona-blanco-transparente.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/\",\"url\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/\",\"name\":\"Calculadora de vacaciones de planilla en Per\u00fa - C Gestiona\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cgestiona.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/logo-c-gestiona-blanco-transparente.png\",\"datePublished\":\"2026-05-14T04:14:15+00:00\",\"dateModified\":\"2026-05-14T04:19:13+00:00\",\"description\":\"Calcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/#primaryimage\",\"url\":\"https:\\\/\\\/cgestiona.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/logo-c-gestiona-blanco-transparente.png\",\"contentUrl\":\"https:\\\/\\\/cgestiona.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/logo-c-gestiona-blanco-transparente.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-vacaciones-planilla\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\\\/\\\/cgestiona.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Calculadora de Vacaciones de planilla\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/cgestiona.com\\\/#website\",\"url\":\"https:\\\/\\\/cgestiona.com\\\/\",\"name\":\"C Gestiona\",\"description\":\"Sitio web oficial\",\"publisher\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/cgestiona.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/cgestiona.com\\\/#organization\",\"name\":\"C Gestiona\",\"url\":\"https:\\\/\\\/cgestiona.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/cgestiona.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/cgestiona.com\\\/wp-content\\\/uploads\\\/2025\\\/03\\\/logo-cgestiona-color-img.png\",\"contentUrl\":\"https:\\\/\\\/cgestiona.com\\\/wp-content\\\/uploads\\\/2025\\\/03\\\/logo-cgestiona-color-img.png\",\"width\":935,\"height\":452,\"caption\":\"C Gestiona\"},\"image\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Calculadora de vacaciones de planilla en Per\u00fa - C Gestiona","description":"Calcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cgestiona.com\/en\/calculadora-vacaciones-planilla\/","og_locale":"en_US","og_type":"article","og_title":"Calculadora de vacaciones de planilla en Per\u00fa - C Gestiona","og_description":"Calcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado.","og_url":"https:\/\/cgestiona.com\/en\/calculadora-vacaciones-planilla\/","og_site_name":"C Gestiona","article_modified_time":"2026-05-14T04:19:13+00:00","og_image":[{"url":"https:\/\/cgestiona.com\/wp-content\/uploads\/2026\/05\/logo-c-gestiona-blanco-transparente.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/","url":"https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/","name":"Calculadora de vacaciones de planilla en Per\u00fa - C Gestiona","isPartOf":{"@id":"https:\/\/cgestiona.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/#primaryimage"},"image":{"@id":"https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/#primaryimage"},"thumbnailUrl":"https:\/\/cgestiona.com\/wp-content\/uploads\/2026\/05\/logo-c-gestiona-blanco-transparente.png","datePublished":"2026-05-14T04:14:15+00:00","dateModified":"2026-05-14T04:19:13+00:00","description":"Calcula los d\u00edas de vacaciones, pago vacacional y beneficios pendientes de un trabajador en planilla seg\u00fan su sueldo y tiempo laborado.","breadcrumb":{"@id":"https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/#primaryimage","url":"https:\/\/cgestiona.com\/wp-content\/uploads\/2026\/05\/logo-c-gestiona-blanco-transparente.png","contentUrl":"https:\/\/cgestiona.com\/wp-content\/uploads\/2026\/05\/logo-c-gestiona-blanco-transparente.png"},{"@type":"BreadcrumbList","@id":"https:\/\/cgestiona.com\/calculadora-vacaciones-planilla\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/cgestiona.com\/"},{"@type":"ListItem","position":2,"name":"Calculadora de Vacaciones de planilla"}]},{"@type":"WebSite","@id":"https:\/\/cgestiona.com\/#website","url":"https:\/\/cgestiona.com\/","name":"C Gestiona","description":"Sitio web oficial","publisher":{"@id":"https:\/\/cgestiona.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cgestiona.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/cgestiona.com\/#organization","name":"C Gestiona","url":"https:\/\/cgestiona.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cgestiona.com\/#\/schema\/logo\/image\/","url":"https:\/\/cgestiona.com\/wp-content\/uploads\/2025\/03\/logo-cgestiona-color-img.png","contentUrl":"https:\/\/cgestiona.com\/wp-content\/uploads\/2025\/03\/logo-cgestiona-color-img.png","width":935,"height":452,"caption":"C Gestiona"},"image":{"@id":"https:\/\/cgestiona.com\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/pages\/988714","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/comments?post=988714"}],"version-history":[{"count":4,"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/pages\/988714\/revisions"}],"predecessor-version":[{"id":988722,"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/pages\/988714\/revisions\/988722"}],"wp:attachment":[{"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/media?parent=988714"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}