{"id":988751,"date":"2026-05-13T23:36:53","date_gmt":"2026-05-14T04:36:53","guid":{"rendered":"https:\/\/cgestiona.com\/?page_id=988751"},"modified":"2026-05-13T23:47:51","modified_gmt":"2026-05-14T04:47:51","slug":"calculadora-hora-extra-normal","status":"publish","type":"page","link":"https:\/\/cgestiona.com\/en\/calculadora-hora-extra-normal\/","title":{"rendered":"Regular overtime calculator"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"988751\" class=\"elementor elementor-988751\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3e12464c e-con-full e-flex e-con e-parent\" data-id=\"3e12464c\" 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-125ece99 e-con-full e-flex e-con e-child\" data-id=\"125ece99\" 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-f72991c e-con-full e-flex e-con e-child\" data-id=\"f72991c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-665be1e7 elementor-widget elementor-widget-heading\" data-id=\"665be1e7\" 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 Hora Extra Normal<\/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-665bc7c0 elementor-widget elementor-widget-text-editor\" data-id=\"665bc7c0\" 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 el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla.\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-71134b41 e-flex e-con-boxed e-con e-parent\" data-id=\"71134b41\" 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-70559d1f elementor-widget-divider--separator-type-pattern elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"70559d1f\" 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-37c9f245 e-flex e-con-boxed e-con e-parent\" data-id=\"37c9f245\" 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-21d5abe5 elementor-widget elementor-widget-html\" data-id=\"21d5abe5\" 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 HORA EXTRA NORMAL \u2014 C GESTIONA\r\n  Versi\u00f3n: 1.0 | Base legal: D.S. 007-2002-TR Art. 10 \/ Ley 27671\r\n  Sobretasa 25% (primeras 2 horas) y 35% (desde la 3ra)\r\n  Modos: Simple (horas+minutos) | Autom\u00e1tico (cantidad total) | Nocturno (cascada)\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-he\">\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-he .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-he .cgc-header-left { display: flex; align-items: center; gap: 16px; }\r\n.cgc-he .cgc-logo { height: 48px; width: auto; flex-shrink: 0; display: block; }\r\n.cgc-he .cgc-header-title-block {\r\n  border-left: 1px solid rgba(255,255,255,0.25); padding-left: 16px;\r\n}\r\n.cgc-he .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-he .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-he .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-he .cgc-pill .ti { font-size: 14px; color: #22A559; }\r\n\r\n.cgc-he .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-he .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-he .cgc-intro .ti { font-size: 16px; color: #22A559; flex-shrink: 0; margin-top: 2px; }\r\n\r\n\/* Toggle *\/\r\n.cgc-he .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-he .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-he .cgc-mode-btn .ti { font-size: 14px; }\r\n.cgc-he .cgc-mode-btn.active { background: #0F3D3A; color: #ffffff; }\r\n\r\n\/* Info modo *\/\r\n.cgc-he .cgc-mode-info {\r\n  background: rgba(59,130,246,0.06); border: 1px solid rgba(59,130,246,0.2);\r\n  border-radius: 7px; padding: 10px 12px; margin-bottom: 12px;\r\n  font-size: 12px; color: #1E40AF;\r\n  display: flex; align-items: flex-start; gap: 8px;\r\n}\r\n.cgc-he .cgc-mode-info .ti { font-size: 14px; flex-shrink: 0; margin-top: 2px; }\r\n.cgc-he .cgc-mode-info strong { color: #1E3A8A; }\r\n\r\n\/* Secciones *\/\r\n.cgc-he .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-he .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-he .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.cgc-he .cgc-sub-title {\r\n  font-size: 11px; font-weight: 500; color: #6B7280;\r\n  text-transform: uppercase; letter-spacing: 0.5px;\r\n  margin-bottom: 8px; margin-top: 12px;\r\n}\r\n\r\n\/* Inputs *\/\r\n.cgc-he .cgc-label {\r\n  display: block; font-size: 12px; color: #4B5563;\r\n  margin-bottom: 5px; font-weight: 500;\r\n}\r\n.cgc-he .cgc-input,\r\n.cgc-he .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-he .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-he .cgc-input:focus,\r\n.cgc-he .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-he .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-he .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-he .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-he .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-he .cgc-input-prefix .cgc-input:focus {\r\n  box-shadow: none; border: none;\r\n}\r\n\r\n.cgc-he .cgc-grid-2 {\r\n  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;\r\n}\r\n\r\n\/* Bloque sobretasa *\/\r\n.cgc-he .cgc-sobretasa-block {\r\n  background: #ffffff;\r\n  border: 1px solid #E5E7EB;\r\n  border-radius: 8px;\r\n  padding: 12px 14px;\r\n  margin-top: 10px;\r\n}\r\n.cgc-he .cgc-sobretasa-header {\r\n  display: flex; align-items: center; justify-content: space-between;\r\n  margin-bottom: 10px;\r\n}\r\n.cgc-he .cgc-sobretasa-badge {\r\n  display: inline-flex; align-items: center; gap: 6px;\r\n  background: rgba(34,165,89,0.12); color: #0F6E3D;\r\n  padding: 4px 10px; border-radius: 999px;\r\n  font-size: 11px; font-weight: 500;\r\n}\r\n.cgc-he .cgc-sobretasa-badge.high {\r\n  background: rgba(245,158,11,0.15); color: #92400E;\r\n}\r\n.cgc-he .cgc-sobretasa-info {\r\n  font-size: 11px; color: #6B7280; font-style: italic;\r\n}\r\n\r\n\/* Banner *\/\r\n.cgc-he .cgc-banner {\r\n  margin-top: 10px; padding: 10px 14px;\r\n  background: rgba(34,165,89,0.08); border-radius: 7px;\r\n  font-size: 12px; color: #0F6E3D;\r\n  display: flex; align-items: center; gap: 8px;\r\n}\r\n.cgc-he .cgc-banner .ti { font-size: 16px; color: #22A559; flex-shrink: 0; }\r\n.cgc-he .cgc-banner strong { color: #064E3B; }\r\n\r\n.cgc-he .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-he .cgc-error.hidden { display: none; }\r\n.cgc-he .cgc-error .ti { font-size: 16px; flex-shrink: 0; margin-top: 1px; color: #DC2626; }\r\n.cgc-he .cgc-error strong { color: #7F1D1D; }\r\n\r\n\/* Bloque protegido *\/\r\n.cgc-he .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-he .cgc-no-copy {\r\n  user-select: none; -webkit-user-select: none;\r\n  position: relative; z-index: 1;\r\n}\r\n.cgc-he .cgc-wm {\r\n  position: absolute; inset: 0; overflow: hidden; pointer-events: none;\r\n  border-radius: 10px;\r\n}\r\n.cgc-he .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-he .cgc-protected-header {\r\n  display: flex; align-items: center; justify-content: space-between;\r\n  margin-bottom: 14px;\r\n}\r\n.cgc-he .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-he .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 *\/\r\n.cgc-he .cgc-cards-grid {\r\n  display: grid; grid-template-columns: 1fr 1fr;\r\n  gap: 10px; margin-bottom: 14px;\r\n}\r\n.cgc-he .cgc-card {\r\n  background: #ffffff; border: 1px solid #E5E7EB;\r\n  border-radius: 8px; padding: 12px 14px;\r\n}\r\n.cgc-he .cgc-card-label {\r\n  font-size: 11px; color: #6B7280;\r\n  text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px;\r\n}\r\n.cgc-he .cgc-card-val {\r\n  font-size: 16px; font-weight: 500; color: #0F3D3A;\r\n  font-variant-numeric: tabular-nums;\r\n}\r\n\r\n\/* Filas *\/\r\n.cgc-he .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-he .cgc-row-label { color: #4B5563; }\r\n.cgc-he .cgc-row-val { color: #111827; font-weight: 500; font-variant-numeric: tabular-nums; }\r\n.cgc-he .cgc-row-val.positive { color: #0F6E3D; }\r\n.cgc-he .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\/* Total *\/\r\n.cgc-he .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-he .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-he .cgc-total-sub {\r\n  font-size: 11px; color: rgba(255,255,255,0.75);\r\n}\r\n.cgc-he .cgc-total-val {\r\n  font-size: 28px; font-weight: 500; color: #ffffff; line-height: 1;\r\n}\r\n\r\n\/* Tabla valores hora *\/\r\n.cgc-he .cgc-rates-table {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr 1fr;\r\n  gap: 0;\r\n  background: #ffffff;\r\n  border: 1px solid #E5E7EB;\r\n  border-radius: 8px;\r\n  overflow: hidden;\r\n  margin-top: 10px;\r\n}\r\n.cgc-he .cgc-rate-cell {\r\n  padding: 10px 12px;\r\n  border-right: 1px solid #F3F4F6;\r\n  text-align: center;\r\n}\r\n.cgc-he .cgc-rate-cell:last-child { border-right: none; }\r\n.cgc-he .cgc-rate-label {\r\n  font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px;\r\n  color: #6B7280; margin-bottom: 2px;\r\n}\r\n.cgc-he .cgc-rate-val {\r\n  font-size: 14px; font-weight: 500; color: #0F3D3A;\r\n  font-variant-numeric: tabular-nums;\r\n}\r\n\r\n\/* Legal *\/\r\n.cgc-he .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-he .cgc-legal .ti { font-size: 14px; flex-shrink: 0; margin-top: 1px; }\r\n.cgc-he .cgc-legal strong { color: #1E3A8A; }\r\n\r\n\/* Botones *\/\r\n.cgc-he .cgc-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }\r\n.cgc-he .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-he .cgc-btn-secondary { background: #ffffff; border-color: #D1D5DB; color: #374151; }\r\n.cgc-he .cgc-btn-secondary:hover { background: #F9FAFB; }\r\n.cgc-he .cgc-btn-primary { background: #22A559; border-color: #22A559; color: #ffffff; }\r\n.cgc-he .cgc-btn-primary:hover { background: #1E8E4D; border-color: #1E8E4D; }\r\n.cgc-he .cgc-btn .ti { font-size: 16px; }\r\n\r\n\/* Footer *\/\r\n.cgc-he .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-he .cgc-footer-left { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #9CA3AF; }\r\n.cgc-he .cgc-footer-left .ti { font-size: 14px; color: #22A559; }\r\n.cgc-he .cgc-footer-right { font-size: 11px; color: #6B7280; font-weight: 500; }\r\n\r\n@media (max-width: 600px) {\r\n  .cgc-he .cgc-grid-2,\r\n  .cgc-he .cgc-cards-grid { grid-template-columns: 1fr !important; }\r\n  .cgc-he .cgc-rates-table { grid-template-columns: 1fr !important; }\r\n  .cgc-he .cgc-rate-cell { border-right: none; border-bottom: 1px solid #F3F4F6; }\r\n  .cgc-he .cgc-rate-cell:last-child { border-bottom: none; }\r\n  .cgc-he .cgc-mode-btn span { display: none; }\r\n  .cgc-he .cgc-mode-btn .ti { font-size: 16px; }\r\n  .cgc-he .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\">Hora extra normal<\/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 el pago de horas extras (sobretiempo) con sobretasa de 25% (primeras 2 horas) y 35% (desde la 3ra hora). Base legal: D.S. 007-2002-TR Art. 10.\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=\"simple\">\r\n      <i class=\"ti ti-clock\"><\/i> <span>Simple<\/span>\r\n    <\/button>\r\n    <button type=\"button\" class=\"cgc-mode-btn\" data-mode=\"auto\">\r\n      <i class=\"ti ti-calculator\"><\/i> <span>Autom\u00e1tico<\/span>\r\n    <\/button>\r\n    <button type=\"button\" class=\"cgc-mode-btn\" data-mode=\"nocturno\">\r\n      <i class=\"ti ti-moon\"><\/i> <span>Nocturno<\/span>\r\n    <\/button>\r\n  <\/div>\r\n\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>Modo Simple:<\/strong> Ingresa horas y minutos en cada sobretasa por separado. \u00datil cuando ya sabes c\u00f3mo distribuyen tus horas extras (ej: 2h al 25% + 1h al 35%).\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- A. Datos -->\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>\r\n      <label class=\"cgc-label\" for=\"cgc-sueldo\">Remuneraci\u00f3n mensual computable<\/label>\r\n      <div class=\"cgc-input-prefix\" style=\"max-width: 280px;\">\r\n        <span>S\/<\/span>\r\n        <input type=\"number\" id=\"cgc-sueldo\" class=\"cgc-input\" value=\"1500\" min=\"0\" step=\"0.01\" \/>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Tabla valores -->\r\n    <div class=\"cgc-rates-table\">\r\n      <div class=\"cgc-rate-cell\">\r\n        <div class=\"cgc-rate-label\">Valor hora normal<\/div>\r\n        <div class=\"cgc-rate-val\" id=\"cgc-rateHora\">S\/ 6.25<\/div>\r\n      <\/div>\r\n      <div class=\"cgc-rate-cell\">\r\n        <div class=\"cgc-rate-label\">Hora extra 25%<\/div>\r\n        <div class=\"cgc-rate-val\" id=\"cgc-rate25\">S\/ 7.81<\/div>\r\n      <\/div>\r\n      <div class=\"cgc-rate-cell\">\r\n        <div class=\"cgc-rate-label\">Hora extra 35%<\/div>\r\n        <div class=\"cgc-rate-val\" id=\"cgc-rate35\">S\/ 8.44<\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- B. Modo Simple -->\r\n  <div class=\"cgc-section\" id=\"cgc-modoSimple\">\r\n    <h3 class=\"cgc-section-title\"><span class=\"cgc-letter\">B<\/span> Horas extras trabajadas<\/h3>\r\n\r\n    <div class=\"cgc-sobretasa-block\">\r\n      <div class=\"cgc-sobretasa-header\">\r\n        <span class=\"cgc-sobretasa-badge\"><i class=\"ti ti-circle-1\"><\/i> Primeras 2 horas (sobretasa 25%)<\/span>\r\n      <\/div>\r\n      <div class=\"cgc-grid-2\">\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-h25\">Horas<\/label>\r\n          <input type=\"number\" id=\"cgc-h25\" class=\"cgc-input\" value=\"0\" min=\"0\" max=\"24\" step=\"1\" \/>\r\n        <\/div>\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-m25\">Minutos<\/label>\r\n          <input type=\"number\" id=\"cgc-m25\" class=\"cgc-input\" value=\"0\" min=\"0\" max=\"59\" step=\"1\" \/>\r\n        <\/div>\r\n      <\/div>\r\n      <p class=\"cgc-sobretasa-info\" style=\"margin-top: 8px;\">Las primeras 2 horas de sobretiempo, por ley.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"cgc-sobretasa-block\">\r\n      <div class=\"cgc-sobretasa-header\">\r\n        <span class=\"cgc-sobretasa-badge high\"><i class=\"ti ti-circle-2\"><\/i> Desde la 3ra hora (sobretasa 35%)<\/span>\r\n      <\/div>\r\n      <div class=\"cgc-grid-2\">\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-h35\">Horas<\/label>\r\n          <input type=\"number\" id=\"cgc-h35\" class=\"cgc-input\" value=\"0\" min=\"0\" max=\"24\" step=\"1\" \/>\r\n        <\/div>\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-m35\">Minutos<\/label>\r\n          <input type=\"number\" id=\"cgc-m35\" class=\"cgc-input\" value=\"0\" min=\"0\" max=\"59\" step=\"1\" \/>\r\n        <\/div>\r\n      <\/div>\r\n      <p class=\"cgc-sobretasa-info\" style=\"margin-top: 8px;\">Aplica a partir de la 3ra hora de sobretiempo en adelante.<\/p>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- B. Modo Auto -->\r\n  <div class=\"cgc-section\" id=\"cgc-modoAuto\" style=\"display: none;\">\r\n    <h3 class=\"cgc-section-title\"><span class=\"cgc-letter\">B<\/span> Total de horas extras del d\u00eda<\/h3>\r\n    <div class=\"cgc-grid-2\">\r\n      <div>\r\n        <label class=\"cgc-label\" for=\"cgc-totalHoras\">Horas extras totales<\/label>\r\n        <input type=\"number\" id=\"cgc-totalHoras\" class=\"cgc-input\" value=\"3\" min=\"0\" max=\"16\" step=\"0.25\" \/>\r\n      <\/div>\r\n      <div>\r\n        <label class=\"cgc-label\" for=\"cgc-diasMes\">Cantidad de d\u00edas con sobretiempo<\/label>\r\n        <input type=\"number\" id=\"cgc-diasMes\" class=\"cgc-input\" value=\"1\" min=\"1\" max=\"31\" step=\"1\" \/>\r\n      <\/div>\r\n    <\/div>\r\n    <p class=\"cgc-sobretasa-info\" style=\"margin-top: 10px;\">\r\n      <i class=\"ti ti-info-circle\"><\/i>\r\n      La calculadora distribuye autom\u00e1ticamente: las primeras 2 horas al 25% y el resto al 35%, multiplicado por la cantidad de d\u00edas.\r\n    <\/p>\r\n  <\/div>\r\n\r\n  <!-- B. Modo Nocturno -->\r\n  <div class=\"cgc-section\" id=\"cgc-modoNocturno\" style=\"display: none;\">\r\n    <h3 class=\"cgc-section-title\"><span class=\"cgc-letter\">B<\/span> Horas extras en jornada nocturna<\/h3>\r\n\r\n    <div class=\"cgc-sobretasa-block\" style=\"background: rgba(245,158,11,0.05); border-color: rgba(245,158,11,0.3);\">\r\n      <p style=\"font-size: 12px; color: #92400E; margin: 0;\">\r\n        <strong>\u26a0\ufe0f C\u00e1lculo en cascada:<\/strong> Cuando trabajas horas extras entre las 10:00 p.m. y 6:00 a.m., el valor hora se incrementa +35% (jornada nocturna) ANTES de aplicar la sobretasa de extras.\r\n      <\/p>\r\n    <\/div>\r\n\r\n    <div class=\"cgc-sobretasa-block\" style=\"margin-top: 10px;\">\r\n      <div class=\"cgc-sobretasa-header\">\r\n        <span class=\"cgc-sobretasa-badge\"><i class=\"ti ti-circle-1\"><\/i> Primeras 2 horas (nocturno + 25%)<\/span>\r\n      <\/div>\r\n      <div class=\"cgc-grid-2\">\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-hNoc25\">Horas<\/label>\r\n          <input type=\"number\" id=\"cgc-hNoc25\" class=\"cgc-input\" value=\"2\" min=\"0\" max=\"24\" step=\"1\" \/>\r\n        <\/div>\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-mNoc25\">Minutos<\/label>\r\n          <input type=\"number\" id=\"cgc-mNoc25\" class=\"cgc-input\" value=\"0\" min=\"0\" max=\"59\" step=\"1\" \/>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"cgc-sobretasa-block\">\r\n      <div class=\"cgc-sobretasa-header\">\r\n        <span class=\"cgc-sobretasa-badge high\"><i class=\"ti ti-circle-2\"><\/i> Desde la 3ra hora (nocturno + 35%)<\/span>\r\n      <\/div>\r\n      <div class=\"cgc-grid-2\">\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-hNoc35\">Horas<\/label>\r\n          <input type=\"number\" id=\"cgc-hNoc35\" class=\"cgc-input\" value=\"0\" min=\"0\" max=\"24\" step=\"1\" \/>\r\n        <\/div>\r\n        <div>\r\n          <label class=\"cgc-label\" for=\"cgc-mNoc35\">Minutos<\/label>\r\n          <input type=\"number\" id=\"cgc-mNoc35\" class=\"cgc-input\" value=\"0\" min=\"0\" max=\"59\" step=\"1\" \/>\r\n        <\/div>\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\">Detalle del c\u00e1lculo<\/span>\r\n        <span class=\"cgc-status\">Calculado<\/span>\r\n      <\/div>\r\n\r\n      <!-- Cards -->\r\n      <div class=\"cgc-cards-grid\" id=\"cgc-cardsGrid\">\r\n        <!-- generadas por JS -->\r\n      <\/div>\r\n\r\n      <!-- Detalle -->\r\n      <div id=\"cgc-detalle\">\r\n        <!-- generado por JS -->\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\">Total horas extras a recibir<\/div>\r\n          <div class=\"cgc-total-sub\" id=\"cgc-totalSub\">Pago adicional sobre el sueldo<\/div>\r\n        <\/div>\r\n        <div class=\"cgc-total-val\" id=\"cgc-totalFinal\">S\/ 0.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> Art. 10 del D.S. 007-2002-TR (TUO Jornada de Trabajo) y Ley 27671. El sobretiempo es voluntario. La falta de pago es infracci\u00f3n de 3er grado (multa hasta 20 UIT). Las horas extras est\u00e1n afectas a AFP\/ONP e Impuesto a la Renta 5ta categor\u00eda.\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 = 'simple';\r\n\r\n  var MODE_INFO = {\r\n    'simple': '<strong>Modo Simple:<\/strong> Ingresa horas y minutos en cada sobretasa por separado. \u00datil cuando ya sabes c\u00f3mo distribuyen tus horas extras (ej: 2h al 25% + 1h al 35%).',\r\n    'auto': '<strong>Modo Autom\u00e1tico:<\/strong> Ingresa el total de horas extras del d\u00eda y la calculadora distribuye autom\u00e1ticamente las primeras 2h al 25% y el resto al 35%. Multiplicado por la cantidad de d\u00edas con sobretiempo.',\r\n    'nocturno': '<strong>Modo Nocturno:<\/strong> Para horas extras realizadas entre las 10:00 p.m. y 6:00 a.m. Aplica c\u00e1lculo en cascada: la base nocturna (+35%) se aplica primero, y luego la sobretasa por horas extras.'\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 fmtHora(n) {\r\n    var h = Math.floor(n);\r\n    var m = Math.round((n - h) * 60);\r\n    if (m === 0) return h + 'h';\r\n    return h + 'h ' + m + 'min';\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 calcular() {\r\n    var sueldo = parseFloat($('cgc-sueldo').value) || 0;\r\n    var valorHora = sueldo \/ 30 \/ 8;\r\n    var valorMin = valorHora \/ 60;\r\n    var rate25 = valorHora * 1.25;\r\n    var rate35 = valorHora * 1.35;\r\n\r\n    $('cgc-rateHora').textContent = fmt(valorHora);\r\n    $('cgc-rate25').textContent = fmt(rate25);\r\n    $('cgc-rate35').textContent = fmt(rate35);\r\n\r\n    var totalMin25 = 0;\r\n    var totalMin35 = 0;\r\n    var pago25 = 0;\r\n    var pago35 = 0;\r\n    var detalleHtml = '';\r\n    var resultTitle = 'Detalle del c\u00e1lculo';\r\n    var totalSub = 'Pago adicional sobre el sueldo';\r\n    var baseDescripcion = '';\r\n\r\n    if (currentMode === 'simple') {\r\n      var h25 = parseInt($('cgc-h25').value) || 0;\r\n      var m25 = parseInt($('cgc-m25').value) || 0;\r\n      var h35 = parseInt($('cgc-h35').value) || 0;\r\n      var m35 = parseInt($('cgc-m35').value) || 0;\r\n\r\n      totalMin25 = h25 * 60 + m25;\r\n      totalMin35 = h35 * 60 + m35;\r\n\r\n      pago25 = totalMin25 * valorMin * 1.25;\r\n      pago35 = totalMin35 * valorMin * 1.35;\r\n\r\n      baseDescripcion = 'Jornada diurna \u00b7 Sobretasas 25% y 35%';\r\n\r\n    } else if (currentMode === 'auto') {\r\n      var totalH = parseFloat($('cgc-totalHoras').value) || 0;\r\n      var dias = parseInt($('cgc-diasMes').value) || 1;\r\n\r\n      \/\/ Por d\u00eda: primeras 2 horas al 25%, el resto al 35%\r\n      var h25Dia = Math.min(totalH, 2);\r\n      var h35Dia = Math.max(0, totalH - 2);\r\n\r\n      \/\/ Total acumulado\r\n      var horas25Total = h25Dia * dias;\r\n      var horas35Total = h35Dia * dias;\r\n\r\n      totalMin25 = horas25Total * 60;\r\n      totalMin35 = horas35Total * 60;\r\n\r\n      pago25 = totalMin25 * valorMin * 1.25;\r\n      pago35 = totalMin35 * valorMin * 1.35;\r\n\r\n      baseDescripcion = dias + (dias === 1 ? ' d\u00eda' : ' d\u00edas') + ' \u00d7 ' + totalH + 'h\/d\u00eda';\r\n\r\n    } else if (currentMode === 'nocturno') {\r\n      var hN25 = parseInt($('cgc-hNoc25').value) || 0;\r\n      var mN25 = parseInt($('cgc-mNoc25').value) || 0;\r\n      var hN35 = parseInt($('cgc-hNoc35').value) || 0;\r\n      var mN35 = parseInt($('cgc-mNoc35').value) || 0;\r\n\r\n      totalMin25 = hN25 * 60 + mN25;\r\n      totalMin35 = hN35 * 60 + mN35;\r\n\r\n      \/\/ C\u00e1lculo en cascada: valor hora con base nocturna (+35%)\r\n      var valorMinNocturno = valorMin * 1.35;\r\n\r\n      pago25 = totalMin25 * valorMinNocturno * 1.25;\r\n      pago35 = totalMin35 * valorMinNocturno * 1.35;\r\n\r\n      baseDescripcion = 'Jornada nocturna \u00b7 C\u00e1lculo en cascada';\r\n    }\r\n\r\n    var totalPago = pago25 + pago35;\r\n    var totalMinutos = totalMin25 + totalMin35;\r\n\r\n    \/\/ Detalle HTML\r\n    if (totalMin25 > 0) {\r\n      var horas25Fmt = fmtHora(totalMin25 \/ 60);\r\n      detalleHtml += '<div class=\"cgc-row\"><span class=\"cgc-row-label\">Horas al 25% (' + horas25Fmt + ')<\/span><span class=\"cgc-row-val positive\">' + fmt(pago25) + '<\/span><\/div>';\r\n    }\r\n    if (totalMin35 > 0) {\r\n      var horas35Fmt = fmtHora(totalMin35 \/ 60);\r\n      detalleHtml += '<div class=\"cgc-row\"><span class=\"cgc-row-label\">Horas al 35% (' + horas35Fmt + ')<\/span><span class=\"cgc-row-val positive\">' + fmt(pago35) + '<\/span><\/div>';\r\n    }\r\n\r\n    if (currentMode === 'nocturno' && totalMinutos > 0) {\r\n      detalleHtml += '<div class=\"cgc-row\" style=\"font-size: 11px; color: #6B7280; font-style: italic; padding-top: 4px;\"><span class=\"cgc-row-label\">Valor hora nocturna (base +35%)<\/span><span class=\"cgc-row-val\" style=\"color: #6B7280;\">' + fmt(valorHora * 1.35) + '<\/span><\/div>';\r\n    }\r\n\r\n    if (totalMinutos === 0) {\r\n      detalleHtml = '<div class=\"cgc-row\" style=\"text-align: center; color: #9CA3AF; font-style: italic; padding: 16px 0;\"><span style=\"flex: 1;\">Ingresa las horas extras trabajadas para ver el c\u00e1lculo<\/span><\/div>';\r\n    } else {\r\n      detalleHtml += '<div class=\"cgc-subtotal\"><span>Total a pagar por horas extras<\/span><span>' + fmt(totalPago) + '<\/span><\/div>';\r\n    }\r\n\r\n    $('cgc-detalle').innerHTML = detalleHtml;\r\n\r\n    \/\/ Cards\r\n    var totalHorasFmt = fmtHora(totalMinutos \/ 60);\r\n    var cardsHtml = '';\r\n    cardsHtml += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Total horas extras<\/div><div class=\"cgc-card-val\">' + (totalMinutos > 0 ? totalHorasFmt : '0h') + '<\/div><\/div>';\r\n    cardsHtml += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Valor hora normal<\/div><div class=\"cgc-card-val\">' + fmt(valorHora) + '<\/div><\/div>';\r\n    cardsHtml += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Tipo de jornada<\/div><div class=\"cgc-card-val\" style=\"font-size: 12px;\">' + (currentMode === 'nocturno' ? 'Nocturna' : 'Diurna') + '<\/div><\/div>';\r\n    cardsHtml += '<div class=\"cgc-card\"><div class=\"cgc-card-label\">Total adicional<\/div><div class=\"cgc-card-val\">' + fmt(totalPago) + '<\/div><\/div>';\r\n    $('cgc-cardsGrid').innerHTML = cardsHtml;\r\n\r\n    $('cgc-totalSub').textContent = baseDescripcion;\r\n    $('cgc-totalFinal').textContent = fmt(totalPago);\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) { b.classList.remove('active'); });\r\n      this.classList.add('active');\r\n      currentMode = this.getAttribute('data-mode');\r\n      $('cgc-modeInfoText').innerHTML = MODE_INFO[currentMode];\r\n      $('cgc-modoSimple').style.display = currentMode === 'simple' ? '' : 'none';\r\n      $('cgc-modoAuto').style.display = currentMode === 'auto' ? '' : 'none';\r\n      $('cgc-modoNocturno').style.display = currentMode === 'nocturno' ? '' : 'none';\r\n      calcular();\r\n    });\r\n  });\r\n\r\n  ['cgc-sueldo','cgc-h25','cgc-m25','cgc-h35','cgc-m35',\r\n   'cgc-totalHoras','cgc-diasMes',\r\n   'cgc-hNoc25','cgc-mNoc25','cgc-hNoc35','cgc-mNoc35']\r\n    .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-sueldo').value = '';\r\n    ['cgc-h25','cgc-m25','cgc-h35','cgc-m35','cgc-hNoc25','cgc-mNoc25','cgc-hNoc35','cgc-mNoc35'].forEach(function(id) {\r\n      $(id).value = '0';\r\n    });\r\n    $('cgc-totalHoras').value = '0';\r\n    $('cgc-diasMes').value = '1';\r\n    calcular();\r\n  });\r\n\r\n  $('cgc-btn-copy').addEventListener('click', function(e) {\r\n    var txt = 'Hora extra normal \u2014 C Gestiona\\n';\r\n    txt += 'Sueldo: ' + fmt(parseFloat($('cgc-sueldo').value) || 0) + '\\n';\r\n    txt += 'Modo: ' + (currentMode === 'simple' ? 'Simple' : currentMode === 'auto' ? 'Autom\u00e1tico' : 'Nocturno') + '\\n';\r\n    txt += 'Total horas extras: ' + $('cgc-totalFinal').textContent + '\\n\\n';\r\n    txt += 'Base legal: D.S. 007-2002-TR Art. 10 \/ Ley 27671\\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 Hora Extra Normal Calcula el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla. Calculadora Hora extra normal Acceso registrado Calcula el pago de horas extras (sobretiempo) con sobretasa de 25% (primeras 2 horas) y 35% (desde la 3ra hora). Base legal: D.S&#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-988751","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 hora extra normal - C Gestiona<\/title>\n<meta name=\"description\" content=\"Calcula el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla.\" \/>\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-hora-extra-normal\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Calculadora de hora extra normal - C Gestiona\" \/>\n<meta property=\"og:description\" content=\"Calcula el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cgestiona.com\/en\/calculadora-hora-extra-normal\/\" \/>\n<meta property=\"og:site_name\" content=\"C Gestiona\" \/>\n<meta property=\"article:modified_time\" content=\"2026-05-14T04:47:51+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-hora-extra-normal\\\/\",\"url\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-hora-extra-normal\\\/\",\"name\":\"Calculadora de hora extra normal - C Gestiona\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-hora-extra-normal\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-hora-extra-normal\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cgestiona.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/logo-c-gestiona-blanco-transparente.png\",\"datePublished\":\"2026-05-14T04:36:53+00:00\",\"dateModified\":\"2026-05-14T04:47:51+00:00\",\"description\":\"Calcula el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-hora-extra-normal\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/cgestiona.com\\\/calculadora-hora-extra-normal\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/cgestiona.com\\\/calculadora-hora-extra-normal\\\/#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-hora-extra-normal\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\\\/\\\/cgestiona.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Calculadora de hora extra normal\"}]},{\"@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 hora extra normal - C Gestiona","description":"Calcula el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla.","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-hora-extra-normal\/","og_locale":"en_US","og_type":"article","og_title":"Calculadora de hora extra normal - C Gestiona","og_description":"Calcula el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla.","og_url":"https:\/\/cgestiona.com\/en\/calculadora-hora-extra-normal\/","og_site_name":"C Gestiona","article_modified_time":"2026-05-14T04:47:51+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-hora-extra-normal\/","url":"https:\/\/cgestiona.com\/calculadora-hora-extra-normal\/","name":"Calculadora de hora extra normal - C Gestiona","isPartOf":{"@id":"https:\/\/cgestiona.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cgestiona.com\/calculadora-hora-extra-normal\/#primaryimage"},"image":{"@id":"https:\/\/cgestiona.com\/calculadora-hora-extra-normal\/#primaryimage"},"thumbnailUrl":"https:\/\/cgestiona.com\/wp-content\/uploads\/2026\/05\/logo-c-gestiona-blanco-transparente.png","datePublished":"2026-05-14T04:36:53+00:00","dateModified":"2026-05-14T04:47:51+00:00","description":"Calcula el pago por hora extra normal de un trabajador seg\u00fan su sueldo, jornada laboral y horas adicionales trabajadas en planilla.","breadcrumb":{"@id":"https:\/\/cgestiona.com\/calculadora-hora-extra-normal\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cgestiona.com\/calculadora-hora-extra-normal\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cgestiona.com\/calculadora-hora-extra-normal\/#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-hora-extra-normal\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/cgestiona.com\/"},{"@type":"ListItem","position":2,"name":"Calculadora de hora extra normal"}]},{"@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\/988751","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=988751"}],"version-history":[{"count":7,"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/pages\/988751\/revisions"}],"predecessor-version":[{"id":988785,"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/pages\/988751\/revisions\/988785"}],"wp:attachment":[{"href":"https:\/\/cgestiona.com\/en\/wp-json\/wp\/v2\/media?parent=988751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}