{"id":18491,"date":"2026-06-21T15:40:34","date_gmt":"2026-06-21T15:40:34","guid":{"rendered":"https:\/\/tendify.net\/?p=18491"},"modified":"2026-06-21T15:49:41","modified_gmt":"2026-06-21T15:49:41","slug":"container-demurrage-calculator","status":"publish","type":"post","link":"https:\/\/tendify.net\/ar\/container-demurrage-calculator\/","title":{"rendered":"Container Demurrage Calculator: Track Free-Time Costs"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"18491\" class=\"elementor elementor-18491\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"wd-negative-gap elementor-element elementor-element-e1eaa3b e-flex e-con-boxed e-con e-parent\" data-id=\"e1eaa3b\" 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-c8e83f2 elementor-widget elementor-widget-html\" data-id=\"c8e83f2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Professional Shipping Demurrage & Detention Calculator<\/title>\r\n    <style>\r\n        \/* CSS Reset & Variables for Tendify Premium Dark Theme *\/\r\n        :root {\r\n            --bg-dark: #0b111e;\r\n            --card-bg: #151f32;\r\n            --card-border: #24344d;\r\n            --accent-cyan: #06b6d4;\r\n            --accent-blue: #3b82f6;\r\n            --text-primary: #f3f4f6;\r\n            --text-secondary: #9ca3af;\r\n            --text-muted: #6b7280;\r\n            --success: #10b981;\r\n            --danger: #ef4444;\r\n            --warning: #f59e0b;\r\n            --font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n        }\r\n\r\n        * {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        body {\r\n            font-family: var(--font-family);\r\n            background-color: var(--bg-dark);\r\n            color: var(--text-primary);\r\n            line-height: 1.5;\r\n            padding: 20px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: center;\r\n            min-height: 100vh;\r\n        }\r\n\r\n        \/* Container designed to fit perfectly inside Elementor Column *\/\r\n        .calculator-wrapper {\r\n            width: 100%;\r\n            max-width: 950px;\r\n            background: var(--card-bg);\r\n            border: 1px solid var(--card-border);\r\n            border-radius: 16px;\r\n            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6), 0 1px 5px rgba(0, 0, 0, 0.3);\r\n            overflow: hidden;\r\n        }\r\n\r\n        \/* Header *\/\r\n        .calc-header {\r\n            background: linear-gradient(135deg, #161b33, #0f172a);\r\n            padding: 28px 24px;\r\n            border-bottom: 1px solid var(--card-border);\r\n            position: relative;\r\n        }\r\n\r\n        .calc-header::after {\r\n            content: '';\r\n            position: absolute;\r\n            bottom: 0;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 3px;\r\n            background: linear-gradient(90deg, var(--accent-blue), var(--accent-cyan));\r\n        }\r\n\r\n        .calc-header h2 {\r\n            font-size: 1.65rem;\r\n            font-weight: 800;\r\n            color: #ffffff;\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 12px;\r\n            letter-spacing: -0.025em;\r\n        }\r\n\r\n        .calc-header p {\r\n            font-size: 0.9rem;\r\n            color: var(--text-secondary);\r\n            margin-top: 6px;\r\n        }\r\n\r\n        \/* Content Layout *\/\r\n        .calc-body {\r\n            padding: 24px;\r\n            display: grid;\r\n            grid-template-columns: 1fr;\r\n            gap: 24px;\r\n        }\r\n\r\n        @media (min-width: 850px) {\r\n            .calc-body {\r\n                grid-template-columns: 1.1fr 0.9fr;\r\n            }\r\n        }\r\n\r\n        \/* Inputs Section *\/\r\n        .inputs-panel {\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: 18px;\r\n        }\r\n\r\n        .form-grid-2 {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 16px;\r\n        }\r\n\r\n        .form-group {\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: 6px;\r\n        }\r\n\r\n        .form-group label {\r\n            font-size: 0.825rem;\r\n            font-weight: 700;\r\n            color: var(--text-primary);\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n        }\r\n\r\n        .form-control {\r\n            background-color: #0b0f19;\r\n            border: 1px solid var(--card-border);\r\n            color: #ffffff;\r\n            padding: 11px 14px;\r\n            border-radius: 8px;\r\n            font-size: 0.95rem;\r\n            outline: none;\r\n            transition: all 0.2s ease;\r\n            width: 100%;\r\n        }\r\n\r\n        .form-control:focus {\r\n            border-color: var(--accent-cyan);\r\n            box-shadow: 0 0 0 2px rgba(6, 182, 212, 0.25);\r\n        }\r\n\r\n        \/* Mode Switcher *\/\r\n        .mode-toggle {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            background: #0b0f19;\r\n            padding: 4px;\r\n            border-radius: 8px;\r\n            border: 1px solid var(--card-border);\r\n            margin-bottom: 4px;\r\n        }\r\n\r\n        .mode-btn {\r\n            background: transparent;\r\n            border: none;\r\n            color: var(--text-secondary);\r\n            padding: 9px;\r\n            border-radius: 6px;\r\n            cursor: pointer;\r\n            font-size: 0.85rem;\r\n            font-weight: 700;\r\n            transition: all 0.2s;\r\n        }\r\n\r\n        .mode-btn.active {\r\n            background-color: var(--accent-blue);\r\n            color: #ffffff;\r\n            box-shadow: 0 2px 4px rgba(59, 130, 246, 0.3);\r\n        }\r\n\r\n        \/* Tiered Inputs *\/\r\n        .tiered-rates-container {\r\n            border: 1px dashed var(--card-border);\r\n            border-radius: 10px;\r\n            padding: 14px;\r\n            background-color: rgba(11, 15, 25, 0.5);\r\n        }\r\n\r\n        .tiered-rates-header {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            margin-bottom: 12px;\r\n        }\r\n\r\n        .tiered-rates-header span {\r\n            font-size: 0.825rem;\r\n            font-weight: 700;\r\n            color: var(--accent-cyan);\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n        }\r\n\r\n        .btn-add-tier {\r\n            background-color: rgba(6, 182, 212, 0.15);\r\n            color: var(--accent-cyan);\r\n            border: 1px solid rgba(6, 182, 212, 0.3);\r\n            border-radius: 6px;\r\n            padding: 4px 12px;\r\n            font-size: 0.75rem;\r\n            font-weight: 700;\r\n            cursor: pointer;\r\n            transition: all 0.2s;\r\n        }\r\n\r\n        .btn-add-tier:hover {\r\n            background-color: var(--accent-cyan);\r\n            color: #0b0f19;\r\n        }\r\n\r\n        .tier-row {\r\n            display: grid;\r\n            grid-template-columns: 1.2fr 1.2fr 1.5fr auto;\r\n            gap: 10px;\r\n            align-items: center;\r\n            margin-bottom: 10px;\r\n        }\r\n\r\n        .tier-row:last-child {\r\n            margin-bottom: 0;\r\n        }\r\n\r\n        .btn-delete-tier {\r\n            background: transparent;\r\n            border: none;\r\n            color: var(--danger);\r\n            cursor: pointer;\r\n            padding: 6px;\r\n            display: flex;\r\n            align-items: center;\r\n            transition: transform 0.2s;\r\n        }\r\n\r\n        .btn-delete-tier:hover {\r\n            transform: scale(1.15);\r\n        }\r\n\r\n        \/* Action Buttons *\/\r\n        .action-buttons {\r\n            margin-top: 8px;\r\n        }\r\n\r\n        .btn-calculate {\r\n            width: 100%;\r\n            background: linear-gradient(90deg, var(--accent-blue), var(--accent-cyan));\r\n            color: #ffffff;\r\n            border: none;\r\n            padding: 14px;\r\n            border-radius: 8px;\r\n            font-weight: 700;\r\n            font-size: 1.05rem;\r\n            cursor: pointer;\r\n            transition: opacity 0.2s, transform 0.1s;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: center;\r\n            gap: 8px;\r\n            box-shadow: 0 4px 15px rgba(6, 182, 212, 0.25);\r\n        }\r\n\r\n        .btn-calculate:hover {\r\n            opacity: 0.95;\r\n        }\r\n\r\n        .btn-calculate:active {\r\n            transform: scale(0.99);\r\n        }\r\n\r\n        \/* Results Section *\/\r\n        .results-panel {\r\n            background-color: #0d1424;\r\n            border: 1px solid var(--card-border);\r\n            border-radius: 14px;\r\n            padding: 24px;\r\n            display: flex;\r\n            flex-direction: column;\r\n            justify-content: space-between;\r\n            gap: 20px;\r\n        }\r\n\r\n        .results-header {\r\n            border-bottom: 1px solid var(--card-border);\r\n            padding-bottom: 14px;\r\n        }\r\n\r\n        .results-title {\r\n            font-size: 1.15rem;\r\n            font-weight: 800;\r\n            color: var(--accent-cyan);\r\n            letter-spacing: -0.01em;\r\n        }\r\n\r\n        .metric-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 12px;\r\n            margin-top: 14px;\r\n        }\r\n\r\n        .metric-card {\r\n            background-color: var(--card-bg);\r\n            border: 1px solid var(--card-border);\r\n            padding: 12px;\r\n            border-radius: 8px;\r\n            text-align: center;\r\n        }\r\n\r\n        .metric-label {\r\n            font-size: 0.725rem;\r\n            color: var(--text-secondary);\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n            margin-bottom: 4px;\r\n        }\r\n\r\n        .metric-value {\r\n            font-size: 1.35rem;\r\n            font-weight: 700;\r\n            color: #ffffff;\r\n        }\r\n\r\n        .metric-value.highlight-danger {\r\n            color: var(--danger);\r\n        }\r\n\r\n        .metric-value.highlight-warning {\r\n            color: var(--warning);\r\n        }\r\n\r\n        \/* Charge Summary Panel *\/\r\n        .charge-summary-box {\r\n            background: linear-gradient(135deg, rgba(59, 130, 246, 0.12), rgba(6, 182, 212, 0.07));\r\n            border: 1px solid rgba(6, 182, 212, 0.25);\r\n            border-radius: 10px;\r\n            padding: 18px;\r\n            text-align: center;\r\n        }\r\n\r\n        .total-charge-label {\r\n            font-size: 0.8rem;\r\n            font-weight: 700;\r\n            color: var(--text-secondary);\r\n            letter-spacing: 0.05em;\r\n            margin-bottom: 4px;\r\n        }\r\n\r\n        .total-charge-value {\r\n            font-size: 2.5rem;\r\n            font-weight: 800;\r\n            color: var(--accent-cyan);\r\n            letter-spacing: -0.02em;\r\n        }\r\n\r\n        .per-container-desc {\r\n            font-size: 0.75rem;\r\n            color: var(--text-muted);\r\n            margin-top: 4px;\r\n        }\r\n\r\n        \/* Breakdown Table styles *\/\r\n        .breakdown-section {\r\n            background-color: rgba(11, 15, 25, 0.5);\r\n            border: 1px solid var(--card-border);\r\n            border-radius: 8px;\r\n            padding: 12px;\r\n            margin-top: 8px;\r\n        }\r\n\r\n        .breakdown-title {\r\n            font-size: 0.75rem;\r\n            font-weight: 700;\r\n            color: var(--text-secondary);\r\n            text-transform: uppercase;\r\n            margin-bottom: 8px;\r\n            display: flex;\r\n            justify-content: space-between;\r\n        }\r\n\r\n        .breakdown-table {\r\n            width: 100%;\r\n            border-collapse: collapse;\r\n            font-size: 0.8rem;\r\n            text-align: left;\r\n        }\r\n\r\n        .breakdown-table th {\r\n            color: var(--text-muted);\r\n            font-weight: 600;\r\n            padding: 6px 4px;\r\n            border-bottom: 1px solid var(--card-border);\r\n        }\r\n\r\n        .breakdown-table td {\r\n            padding: 8px 4px;\r\n            border-bottom: 1px dashed rgba(36, 52, 77, 0.5);\r\n            color: var(--text-primary);\r\n        }\r\n\r\n        .breakdown-table tr:last-child td {\r\n            border-bottom: none;\r\n        }\r\n\r\n        \/* Timeline Tracker *\/\r\n        .timeline-container {\r\n            padding: 12px;\r\n            background-color: rgba(11, 15, 25, 0.6);\r\n            border-radius: 8px;\r\n            border: 1px solid var(--card-border);\r\n        }\r\n\r\n        .timeline-title {\r\n            font-size: 0.75rem;\r\n            font-weight: 700;\r\n            color: var(--text-secondary);\r\n            margin-bottom: 10px;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n        }\r\n\r\n        .timeline-bar {\r\n            display: flex;\r\n            height: 10px;\r\n            border-radius: 5px;\r\n            overflow: hidden;\r\n            background-color: var(--card-border);\r\n            margin-bottom: 10px;\r\n        }\r\n\r\n        .timeline-segment {\r\n            height: 100%;\r\n            transition: width 0.3s ease;\r\n        }\r\n\r\n        .segment-free {\r\n            background-color: var(--success);\r\n        }\r\n\r\n        .segment-demurrage {\r\n            background-color: var(--danger);\r\n        }\r\n\r\n        .timeline-legend {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            font-size: 0.7rem;\r\n        }\r\n\r\n        .legend-item {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 6px;\r\n        }\r\n\r\n        .legend-dot {\r\n            width: 8px;\r\n            height: 8px;\r\n            border-radius: 50%;\r\n        }\r\n\r\n        \/* Footer Utilities *\/\r\n        .utility-buttons {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 10px;\r\n        }\r\n\r\n        .btn-utility {\r\n            background-color: transparent;\r\n            border: 1px solid var(--card-border);\r\n            color: var(--text-secondary);\r\n            padding: 10px;\r\n            border-radius: 8px;\r\n            font-size: 0.85rem;\r\n            font-weight: 600;\r\n            cursor: pointer;\r\n            transition: all 0.2s;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: 6px;\r\n        }\r\n\r\n        .btn-utility:hover {\r\n            border-color: var(--accent-cyan);\r\n            color: #ffffff;\r\n            background-color: rgba(6, 182, 212, 0.05);\r\n        }\r\n\r\n        \/* Custom Toast Notification System *\/\r\n        .toast-notification {\r\n            position: fixed;\r\n            bottom: 24px;\r\n            right: 24px;\r\n            background-color: #1e293b;\r\n            border-left: 4px solid var(--accent-cyan);\r\n            color: #ffffff;\r\n            padding: 14px 20px;\r\n            border-radius: 6px;\r\n            box-shadow: 0 10px 25px rgba(0,0,0,0.4);\r\n            z-index: 1000;\r\n            transform: translateY(100px);\r\n            opacity: 0;\r\n            transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);\r\n            font-size: 0.875rem;\r\n            pointer-events: none;\r\n            font-weight: 600;\r\n        }\r\n\r\n        .toast-notification.show {\r\n            transform: translateY(0);\r\n            opacity: 1;\r\n        }\r\n\r\n        \/* Print Override *\/\r\n        @media print {\r\n            body {\r\n                background: white;\r\n                color: black;\r\n            }\r\n            .calculator-wrapper {\r\n                box-shadow: none;\r\n                border: none;\r\n                max-width: 100%;\r\n            }\r\n            .calc-header, .btn-calculate, .utility-buttons, .btn-add-tier, .btn-delete-tier, .mode-toggle {\r\n                display: none !important;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"calculator-wrapper\">\r\n        <!-- Header Section -->\r\n        <div class=\"calc-header\">\r\n            <h2>\r\n                <svg width=\"26\" height=\"26\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"color: var(--accent-cyan)\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"><\/rect><line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"><\/line><line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"><\/line><line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"><\/line><\/svg>\r\n                Shipping Demurrage & Detention Calculator\r\n            <\/h2>\r\n            <p>Perform precise multi-container calculations with progressive tiered slabs and breakdown analytics.<\/p>\r\n        <\/div>\r\n\r\n        <!-- Calculator Layout -->\r\n        <div class=\"calc-body\">\r\n            <!-- Left Side: Interactive Inputs -->\r\n            <div class=\"inputs-panel\">\r\n                \r\n                <div class=\"form-grid-2\">\r\n                    <div class=\"form-group\">\r\n                        <label for=\"discharge-date\">Discharge Date<\/label>\r\n                        <input type=\"date\" id=\"discharge-date\" class=\"form-control\">\r\n                    <\/div>\r\n                    <div class=\"form-group\">\r\n                        <label for=\"return-date\">Empty Return Date<\/label>\r\n                        <input type=\"date\" id=\"return-date\" class=\"form-control\">\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"form-grid-2\">\r\n                    <div class=\"form-group\">\r\n                        <label for=\"container-type\">Container Size\/Type<\/label>\r\n                        <select id=\"container-type\" class=\"form-control\" onchange=\"autoAdjustDefaultRates()\">\r\n                            <option value=\"20gp\">20' Dry Van (GP)<\/option>\r\n                            <option value=\"40gp\" selected>40' Dry Van (GP\/HC)<\/option>\r\n                            <option value=\"40reefer\">40' Reefer (Temperature Controlled)<\/option>\r\n                            <option value=\"special\">Special Equipment (FlatRack\/OpenTop)<\/option>\r\n                        <\/select>\r\n                    <\/div>\r\n                    <div class=\"form-group\">\r\n                        <label for=\"container-qty\">Quantity<\/label>\r\n                        <input type=\"number\" id=\"container-qty\" class=\"form-control\" min=\"1\" value=\"1\" onchange=\"performCalculation()\">\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"form-grid-2\">\r\n                    <div class=\"form-group\">\r\n                        <label for=\"free-days\">Contracted Free Days<\/label>\r\n                        <input type=\"number\" id=\"free-days\" class=\"form-control\" min=\"0\" value=\"7\" oninput=\"performCalculation()\">\r\n                    <\/div>\r\n                    <div class=\"form-group\">\r\n                        <label for=\"currency-select\">Currency<\/label>\r\n                        <select id=\"currency-select\" class=\"form-control\" onchange=\"performCalculation()\">\r\n                            <option value=\"USD\">USD ($)<\/option>\r\n                            <option value=\"EUR\">EUR (\u20ac)<\/option>\r\n                            <option value=\"GBP\">GBP (\u00a3)<\/option>\r\n                        <\/select>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"form-group\">\r\n                    <label>Rate Structure Mode<\/label>\r\n                    <div class=\"mode-toggle\">\r\n                        <button type=\"button\" class=\"mode-btn active\" id=\"mode-flat\" onclick=\"switchRateMode('flat')\">Flat Daily Rate<\/button>\r\n                        <button type=\"button\" class=\"mode-btn\" id=\"mode-tiered\" onclick=\"switchRateMode('tiered')\">Tiered Rates (Slabs)<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Flat Rate Input -->\r\n                <div class=\"form-group\" id=\"flat-rate-container\">\r\n                    <label for=\"daily-rate\">Daily Penalty Rate (Per Container)<\/label>\r\n                    <input type=\"number\" id=\"daily-rate\" class=\"form-control\" min=\"0\" value=\"120\" oninput=\"performCalculation()\">\r\n                <\/div>\r\n\r\n                <!-- Progressive Tiered Rate Input -->\r\n                <div class=\"tiered-rates-container\" id=\"tiered-rate-container\" style=\"display: none;\">\r\n                    <div class=\"tiered-rates-header\">\r\n                        <span>Define Penalty Slabs<\/span>\r\n                        <button type=\"button\" class=\"btn-add-tier\" onclick=\"addNewTierRow()\">+ Add Slab<\/button>\r\n                    <\/div>\r\n                    <div id=\"tier-rows-list\">\r\n                        <!-- Tiers are added dynamically here -->\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Trigger Action -->\r\n                <div class=\"action-buttons\">\r\n                    <button class=\"btn-calculate\" onclick=\"performCalculation()\">\r\n                        <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"><\/path><polyline points=\"22 4 12 14.01 9 11.01\"><\/polyline><\/svg>\r\n                        Calculate Demurrage & Detention\r\n                    <\/button>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n            <!-- Right Side: Real-time Results & Analytics -->\r\n            <div class=\"results-panel\">\r\n                <div>\r\n                    <div class=\"results-header\">\r\n                        <div class=\"results-title\">Calculated Breakdown<\/div>\r\n                    <\/div>\r\n\r\n                    <div class=\"metric-grid\">\r\n                        <div class=\"metric-card\">\r\n                            <div class=\"metric-label\">Total Days Out<\/div>\r\n                            <div class=\"metric-value\" id=\"res-total-days\">-<\/div>\r\n                        <\/div>\r\n                        <div class=\"metric-card\">\r\n                            <div class=\"metric-label\">Free Days Used<\/div>\r\n                            <div class=\"metric-value highlight-warning\" id=\"res-free-used\">-<\/div>\r\n                        <\/div>\r\n                        <div class=\"metric-card\">\r\n                            <div class=\"metric-label\">Overdue Days<\/div>\r\n                            <div class=\"metric-value highlight-danger\" id=\"res-overdue-days\">-<\/div>\r\n                        <\/div>\r\n                        <div class=\"metric-card\">\r\n                            <div class=\"metric-label\">Containers<\/div>\r\n                            <div class=\"metric-value\" id=\"res-container-count\">-<\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <!-- Charge Summary Box -->\r\n                    <div class=\"charge-summary-box\" style=\"margin-top: 14px; margin-bottom: 14px;\">\r\n                        <div class=\"total-charge-label\">ESTIMATED TOTAL PENALTY<\/div>\r\n                        <div class=\"total-charge-value\" id=\"res-total-charge\">$0.00<\/div>\r\n                        <div class=\"per-container-desc\" id=\"res-per-container-desc\">For 1 container of 40' Dry Van<\/div>\r\n                    <\/div>\r\n\r\n                    <!-- Slabs Detailed Breakdown Table -->\r\n                    <div class=\"breakdown-section\" id=\"breakdown-section\" style=\"display: none;\">\r\n                        <div class=\"breakdown-title\">\r\n                            <span>Slab-wise Breakdown<\/span>\r\n                            <span id=\"breakdown-currency\">USD<\/span>\r\n                        <\/div>\r\n                        <table class=\"breakdown-table\">\r\n                            <thead>\r\n                                <tr>\r\n                                    <th>Days Slab<\/th>\r\n                                    <th>Days<\/th>\r\n                                    <th>Rate\/Day<\/th>\r\n                                    <th>Slab Subtotal<\/th>\r\n                                <\/tr>\r\n                            <\/thead>\r\n                            <tbody id=\"breakdown-table-body\">\r\n                                <!-- Dynamic breakdown rows inserted here -->\r\n                            <\/tbody>\r\n                        <\/table>\r\n                    <\/div>\r\n\r\n                    <!-- Visual Timeline -->\r\n                    <div class=\"timeline-container\" style=\"margin-top: 12px;\">\r\n                        <div class=\"timeline-title\">Journey Progress Tracker<\/div>\r\n                        <div class=\"timeline-bar\">\r\n                            <div id=\"bar-free\" class=\"timeline-segment segment-free\" style=\"width: 50%;\"><\/div>\r\n                            <div id=\"bar-demurrage\" class=\"timeline-segment segment-demurrage\" style=\"width: 50%;\"><\/div>\r\n                        <\/div>\r\n                        <div class=\"timeline-legend\">\r\n                            <div class=\"legend-item\">\r\n                                <span class=\"legend-dot segment-free\"><\/span>\r\n                                <span id=\"legend-free-text\">Free Period (0 Days)<\/span>\r\n                            <\/div>\r\n                            <div class=\"legend-item\">\r\n                                <span class=\"legend-dot segment-demurrage\"><\/span>\r\n                                <span id=\"legend-overdue-text\">Overdue Period (0 Days)<\/span>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Utilities (Copy, Share) -->\r\n                <div class=\"utility-buttons\">\r\n                    <button class=\"btn-utility\" onclick=\"copyReportToClipboard()\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2\"><\/path><rect x=\"8\" y=\"2\" width=\"8\" height=\"4\" rx=\"1\" ry=\"1\"><\/rect><\/svg>\r\n                        Copy Report\r\n                    <\/button>\r\n                    <button class=\"btn-utility\" onclick=\"window.print()\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"6 9 6 2 18 2 18 9\"><\/polyline><path d=\"M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2\"><\/path><rect x=\"6\" y=\"14\" width=\"12\" height=\"8\"><\/rect><\/svg>\r\n                        Print Details\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- UI Notification System -->\r\n    <div id=\"toast\" class=\"toast-notification\">Report copied to clipboard!<\/div>\r\n\r\n    <script>\r\n        let activeRateMode = 'flat';\r\n        \r\n        \/\/ Default Tier Configurations depending on Container Types\r\n        const containerTypeRates = {\r\n            '20gp': { flat: 90, tiers: [{ s: 1, e: 7, r: 40 }, { s: 8, e: 14, r: 80 }, { s: 15, e: 999, r: 120 }] },\r\n            '40gp': { flat: 120, tiers: [{ s: 1, e: 7, r: 60 }, { s: 8, e: 14, r: 110 }, { s: 15, e: 999, r: 160 }] },\r\n            '40reefer': { flat: 220, tiers: [{ s: 1, e: 5, r: 120 }, { s: 6, e: 12, r: 200 }, { s: 13, e: 999, r: 350 }] },\r\n            'special': { flat: 180, tiers: [{ s: 1, e: 7, r: 90 }, { s: 8, e: 14, r: 160 }, { s: 15, e: 999, r: 240 }] }\r\n        };\r\n\r\n        const currencySymbols = {\r\n            'USD': '$',\r\n            'EUR': '\u20ac',\r\n            'GBP': '\u00a3'\r\n        };\r\n\r\n        window.addEventListener('DOMContentLoaded', () => {\r\n            const today = new Date();\r\n            const futureDate = new Date();\r\n            futureDate.setDate(today.getDate() + 15); \/\/ Default 15 days of storage\r\n\r\n            document.getElementById('discharge-date').value = formatDateISO(today);\r\n            document.getElementById('return-date').value = formatDateISO(futureDate);\r\n\r\n            \/\/ Load default tiers for 40GP\r\n            loadDefaultTiersForType('40gp');\r\n            performCalculation();\r\n        });\r\n\r\n        function formatDateISO(date) {\r\n            const yyyy = date.getFullYear();\r\n            const mm = String(date.getMonth() + 1).padStart(2, '0');\r\n            const dd = String(date.getDate()).padStart(2, '0');\r\n            return `${yyyy}-${mm}-${dd}`;\r\n        }\r\n\r\n        function autoAdjustDefaultRates() {\r\n            const containerType = document.getElementById('container-type').value;\r\n            const targetRates = containerTypeRates[containerType];\r\n            \r\n            \/\/ Adjust Flat Rate Input\r\n            document.getElementById('daily-rate').value = targetRates.flat;\r\n            \r\n            \/\/ Rebuild Tier Slab Inputs\r\n            loadDefaultTiersForType(containerType);\r\n            performCalculation();\r\n        }\r\n\r\n        function loadDefaultTiersForType(type) {\r\n            const listContainer = document.getElementById('tier-rows-list');\r\n            listContainer.innerHTML = '';\r\n            containerTypeRates[type].tiers.forEach((tier) => {\r\n                createTierRow(tier.s, tier.e, tier.r);\r\n            });\r\n        }\r\n\r\n        function createTierRow(start, end, rate) {\r\n            const listContainer = document.getElementById('tier-rows-list');\r\n            const rowDiv = document.createElement('div');\r\n            rowDiv.className = 'tier-row';\r\n            rowDiv.innerHTML = `\r\n                <input type=\"number\" class=\"form-control tier-start\" placeholder=\"From Day\" value=\"${start}\" min=\"1\" oninput=\"performCalculation()\">\r\n                <input type=\"number\" class=\"form-control tier-end\" placeholder=\"To Day\" value=\"${end}\" min=\"1\" oninput=\"performCalculation()\">\r\n                <input type=\"number\" class=\"form-control tier-rate\" placeholder=\"Rate\" value=\"${rate}\" min=\"0\" oninput=\"performCalculation()\">\r\n                <button type=\"button\" class=\"btn-delete-tier\" onclick=\"deleteTierRow(this)\" title=\"Delete Slab\">\r\n                    <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><polyline points=\"3 6 5 6 21 6\"><\/polyline><path d=\"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2\"><\/path><\/svg>\r\n                <\/button>\r\n            `;\r\n            listContainer.appendChild(rowDiv);\r\n        }\r\n\r\n        function addNewTierRow() {\r\n            createTierRow('', '', '');\r\n        }\r\n\r\n        function deleteTierRow(btnElement) {\r\n            btnElement.parentElement.remove();\r\n            performCalculation();\r\n        }\r\n\r\n        function switchRateMode(mode) {\r\n            activeRateMode = mode;\r\n            const flatBtn = document.getElementById('mode-flat');\r\n            const tieredBtn = document.getElementById('mode-tiered');\r\n            const flatContainer = document.getElementById('flat-rate-container');\r\n            const tieredContainer = document.getElementById('tiered-rate-container');\r\n\r\n            if (mode === 'flat') {\r\n                flatBtn.classList.add('active');\r\n                tieredBtn.classList.remove('active');\r\n                flatContainer.style.display = 'block';\r\n                tieredContainer.style.display = 'none';\r\n            } else {\r\n                flatBtn.classList.remove('active');\r\n                tieredBtn.classList.add('active');\r\n                flatContainer.style.display = 'none';\r\n                tieredContainer.style.display = 'block';\r\n            }\r\n            performCalculation();\r\n        }\r\n\r\n        function showToast(message) {\r\n            const toast = document.getElementById('toast');\r\n            toast.textContent = message;\r\n            toast.classList.add('show');\r\n            setTimeout(() => {\r\n                toast.classList.remove('show');\r\n            }, 3000);\r\n        }\r\n\r\n        function performCalculation() {\r\n            const dischargeVal = document.getElementById('discharge-date').value;\r\n            const returnVal = document.getElementById('return-date').value;\r\n            const freeDays = parseInt(document.getElementById('free-days').value) || 0;\r\n            const qty = parseInt(document.getElementById('container-qty').value) || 1;\r\n            const currency = document.getElementById('currency-select').value;\r\n            const currencySymbol = currencySymbols[currency];\r\n\r\n            if (!dischargeVal || !returnVal) {\r\n                return;\r\n            }\r\n\r\n            const dDate = new Date(dischargeVal);\r\n            const rDate = new Date(returnVal);\r\n\r\n            const timeDiff = rDate.getTime() - dDate.getTime();\r\n            let totalDays = Math.ceil(timeDiff \/ (1000 * 3600 * 24));\r\n            \r\n            if (totalDays < 0) {\r\n                showToast(\"Error: Empty return date cannot occur before discharge date.\");\r\n                totalDays = 0;\r\n            }\r\n\r\n            const freeDaysUsed = Math.min(totalDays, freeDays);\r\n            const overdueDays = Math.max(0, totalDays - freeDays);\r\n\r\n            let totalChargeOneContainer = 0;\r\n            let breakdownRowsHtml = '';\r\n            const breakdownSection = document.getElementById('breakdown-section');\r\n\r\n            if (overdueDays > 0) {\r\n                if (activeRateMode === 'flat') {\r\n                    const flatRate = parseFloat(document.getElementById('daily-rate').value) || 0;\r\n                    totalChargeOneContainer = overdueDays * flatRate;\r\n                    breakdownSection.style.display = 'none';\r\n                } else {\r\n                    breakdownSection.style.display = 'block';\r\n                    document.getElementById('breakdown-currency').textContent = currency;\r\n                    \r\n                    \/\/ Harvest defined slabs\/tiers\r\n                    const rows = document.querySelectorAll('#tier-rows-list .tier-row');\r\n                    let tiers = [];\r\n                    \r\n                    rows.forEach(row => {\r\n                        const s = parseInt(row.querySelector('.tier-start').value) || 0;\r\n                        const e = parseInt(row.querySelector('.tier-end').value) || 9999;\r\n                        const r = parseFloat(row.querySelector('.tier-rate').value) || 0;\r\n                        if (s > 0) {\r\n                            tiers.push({ start: s, end: e, rate: r });\r\n                        }\r\n                    });\r\n\r\n                    tiers.sort((a, b) => a.start - b.start);\r\n\r\n                    \/\/ Track days per slab for reporting\r\n                    let slabDayCounts = Array(tiers.length).fill(0);\r\n\r\n                    for (let d = 1; d <= overdueDays; d++) {\r\n                        for (let t = 0; t < tiers.length; t++) {\r\n                            if (d >= tiers[t].start && d <= tiers[t].end) {\r\n                                totalChargeOneContainer += tiers[t].rate;\r\n                                slabDayCounts[t]++;\r\n                                break;\r\n                            }\r\n                        }\r\n                    }\r\n\r\n                    \/\/ Render breakdown table rows\r\n                    tiers.forEach((tier, index) => {\r\n                        const daysInSlab = slabDayCounts[index];\r\n                        if (daysInSlab > 0) {\r\n                            const slabSubtotal = daysInSlab * tier.rate;\r\n                            const rangeLabel = tier.end === 999 || tier.end >= 9999 ? `Day ${tier.start}+` : `Days ${tier.start} - ${tier.end}`;\r\n                            breakdownRowsHtml += `\r\n                                <tr>\r\n                                    <td>${rangeLabel}<\/td>\r\n                                    <td>${daysInSlab}<\/td>\r\n                                    <td>${currencySymbol}${tier.rate.toFixed(2)}<\/td>\r\n                                    <td>${currencySymbol}${slabSubtotal.toFixed(2)}<\/td>\r\n                                <\/tr>\r\n                            `;\r\n                        }\r\n                    });\r\n                    document.getElementById('breakdown-table-body').innerHTML = breakdownRowsHtml;\r\n                }\r\n            } else {\r\n                breakdownSection.style.display = 'none';\r\n            }\r\n\r\n            const grandTotalCharge = totalChargeOneContainer * qty;\r\n\r\n            \/\/ Update UI elements\r\n            document.getElementById('res-total-days').textContent = totalDays;\r\n            document.getElementById('res-free-used').textContent = `${freeDaysUsed} \/ ${freeDays}`;\r\n            document.getElementById('res-overdue-days').textContent = overdueDays;\r\n            document.getElementById('res-container-count').textContent = qty;\r\n            document.getElementById('res-total-charge').textContent = `${currencySymbol}${grandTotalCharge.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;\r\n\r\n            \/\/ Info label detail update\r\n            const containerSelect = document.getElementById('container-type');\r\n            const containerName = containerSelect.options[containerSelect.selectedIndex].text;\r\n            document.getElementById('res-per-container-desc').textContent = `Total calculation for ${qty} x [${containerName}]`;\r\n\r\n            \/\/ Progress Timeline updates\r\n            const barFree = document.getElementById('bar-free');\r\n            const barDemurrage = document.getElementById('bar-demurrage');\r\n            const legendFree = document.getElementById('legend-free-text');\r\n            const legendOverdue = document.getElementById('legend-overdue-text');\r\n\r\n            if (totalDays === 0) {\r\n                barFree.style.width = '0%';\r\n                barDemurrage.style.width = '0%';\r\n                legendFree.textContent = `Free Period (0 Days)`;\r\n                legendOverdue.textContent = `Overdue (0 Days)`;\r\n            } else {\r\n                const freePercent = (freeDaysUsed \/ totalDays) * 100;\r\n                const demurragePercent = (overdueDays \/ totalDays) * 100;\r\n                \r\n                barFree.style.width = `${freePercent}%`;\r\n                barDemurrage.style.width = `${demurragePercent}%`;\r\n                \r\n                legendFree.textContent = `Free Period (${freeDaysUsed} Days)`;\r\n                legendOverdue.textContent = `Overdue (${overdueDays} Days)`;\r\n            }\r\n        }\r\n\r\n        function copyReportToClipboard() {\r\n            const discharge = document.getElementById('discharge-date').value;\r\n            const returnDate = document.getElementById('return-date').value;\r\n            const totalDays = document.getElementById('res-total-days').textContent;\r\n            const freeDaysUsed = document.getElementById('res-free-used').textContent;\r\n            const overdue = document.getElementById('res-overdue-days').textContent;\r\n            const qty = document.getElementById('res-container-count').textContent;\r\n            const finalFee = document.getElementById('res-total-charge').textContent;\r\n            \r\n            const containerSelect = document.getElementById('container-type');\r\n            const containerName = containerSelect.options[containerSelect.selectedIndex].text;\r\n\r\n            const textReport = \r\n`--- SHIPPING DEMURRAGE & DETENTION REPORT ---\r\nDischarge Date: ${discharge}\r\nEmpty Return Date: ${returnDate}\r\nTotal Transit Period: ${totalDays} Days\r\nFree Days Used: ${freeDaysUsed} Days\r\nTotal Overdue (Penalty) Period: ${overdue} Days\r\nContainer Info: ${qty} x ${containerName}\r\n---------------------------------------------\r\nESTIMATED TOTAL PENALTY: ${finalFee}\r\nGenerated via Tendify Demurrage Tool`;\r\n\r\n            const dummyEl = document.createElement(\"textarea\");\r\n            document.body.appendChild(dummyEl);\r\n            dummyEl.value = textReport;\r\n            dummyEl.select();\r\n            document.execCommand('copy');\r\n            document.body.removeChild(dummyEl);\r\n\r\n            showToast(\"Report summary copied successfully!\");\r\n        }\r\n    <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-3278c44 e-flex e-con-boxed e-con e-parent\" data-id=\"3278c44\" 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-07984ae elementor-widget elementor-widget-spacer\" data-id=\"07984ae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-64d869a e-flex e-con-boxed e-con e-parent\" data-id=\"64d869a\" 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-382d490 elementor-widget elementor-widget-wd_text_block\" data-id=\"382d490\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"wd_text_block.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"wd-text-block reset-last-child text-left\">\n\t\t\t\n\t\t\t<h1 data-path-to-node=\"2\"><span style=\"color: #000000;\">Shipping Demurrage &amp; Detention Calculator: Avoid Costly Port Penalties<\/span><\/h1><p data-path-to-node=\"3\"><span style=\"color: #000000;\">Managing international supply chains requires laser-sharp precision, especially when it comes to controlling post-discharge costs. Container delay fees\u2014commonly known as <b data-path-to-node=\"3\" data-index-in-node=\"170\">Demurrage and Detention (D&amp;D)<\/b>\u2014can quickly accumulate, draining your shipping profit margins.<\/span><\/p><p data-path-to-node=\"4\"><span style=\"color: #000000;\">To help freight forwarders, importers, and logistics managers stay ahead of the clock, <b data-path-to-node=\"4\" data-index-in-node=\"87\">Tendify<\/b> has engineered this advanced, real-time <b data-path-to-node=\"4\" data-index-in-node=\"135\">Shipping Demurrage &amp; Detention Calculator<\/b>. Whether you are dealing with standard dry vans or temperature-controlled reefer units, our intuitive tool delivers instant financial visibility before your cargo incurs heavy fines.<\/span><\/p><h2 data-path-to-node=\"6\"><span style=\"color: #000000;\">What is Demurrage and Detention in Shipping?<\/span><\/h2><p data-path-to-node=\"7\"><span style=\"color: #000000;\">Before calculating your potential costs, it is vital to distinguish between these two frequently interchanged port fees:<\/span><\/p><ul data-path-to-node=\"8\"><li><p data-path-to-node=\"8,0,0\"><span style=\"color: #000000;\"><b data-path-to-node=\"8,0,0\" data-index-in-node=\"0\">Demurrage:<\/b> This penalty is charged by the shipping line when your loaded container remains inside the port terminal boundary past the allowed contractual \"free time.\"<\/span><\/p><\/li><li><p data-path-to-node=\"8,1,0\"><span style=\"color: #000000;\"><b data-path-to-node=\"8,1,0\" data-index-in-node=\"0\">Detention:<\/b> This fee applies when you have picked up the container from the yard (Gate-Out) but fail to return the empty equipment back to the carrier\u2019s designated depot within the agreed timeframe.<\/span><\/p><\/li><\/ul><h2 data-path-to-node=\"10\"><span style=\"color: #000000;\">How to Use the Demurrage &amp; Detention Calculator<\/span><\/h2><p data-path-to-node=\"11\"><span style=\"color: #000000;\">Our interactive shipping tool is designed for simplicity and corporate accuracy. Follow these straightforward steps to map out your transit timeline:<\/span><\/p><ol start=\"1\" data-path-to-node=\"12\"><li><p data-path-to-node=\"12,0,0\"><span style=\"color: #000000;\"><b data-path-to-node=\"12,0,0\" data-index-in-node=\"0\">Select Your Key Timeline Dates:<\/b> Input your <b data-path-to-node=\"12,0,0\" data-index-in-node=\"43\">Vessel Discharge Date<\/b> (or the exact day your free time countdown begins) and your estimated <b data-path-to-node=\"12,0,0\" data-index-in-node=\"135\">Empty Return Date<\/b>.<\/span><\/p><\/li><li><p data-path-to-node=\"12,1,0\"><span style=\"color: #000000;\"><b data-path-to-node=\"12,1,0\" data-index-in-node=\"0\">Input Container Specifications:<\/b> Select your equipment profile (<b data-path-to-node=\"12,1,0\" data-index-in-node=\"63\">20' GP, 40' HC, or 40' Reefer<\/b>) and enter the total <b data-path-to-node=\"12,1,0\" data-index-in-node=\"114\">Quantity<\/b> of containers in your bill of lading (BOL).<\/span><\/p><\/li><li><p data-path-to-node=\"12,2,0\"><span style=\"color: #000000;\"><b data-path-to-node=\"12,2,0\" data-index-in-node=\"0\">Set Contractual Free Days:<\/b> Enter the number of free storage days granted by your ocean carrier contract (typically ranging from 5 to 14 days).<\/span><\/p><\/li><li><p data-path-to-node=\"12,3,0\"><span style=\"color: #000000;\"><b data-path-to-node=\"12,3,0\" data-index-in-node=\"0\">Choose Your Rate Structure:<\/b><\/span><\/p><ul data-path-to-node=\"12,3,1\"><li><p data-path-to-node=\"12,3,1,0,0\"><span style=\"color: #000000;\">Select <b data-path-to-node=\"12,3,1,0,0\" data-index-in-node=\"7\">Flat Daily Rate<\/b> if your shipping line applies a static cost per day.<\/span><\/p><\/li><li><p data-path-to-node=\"12,3,1,1,0\"><span style=\"color: #000000;\">Select <b data-path-to-node=\"12,3,1,1,0\" data-index-in-node=\"7\">Tiered Rates (Slabs)<\/b> if your carrier utilizes a progressive penalty scale (e.g., $60\/day for the first week, scaling up to $120\/day afterward).<\/span><\/p><\/li><\/ul><\/li><li><p data-path-to-node=\"12,4,0\"><span style=\"color: #000000;\"><b data-path-to-node=\"12,4,0\" data-index-in-node=\"0\">Analyze the Results:<\/b> Click <b data-path-to-node=\"12,4,0\" data-index-in-node=\"27\">Calculate Demurrage<\/b> to view an instant visual timeline, a day-by-day cost breakdown, and the total estimated penalty formatted in your preferred currency (USD, EUR, or GBP).<\/span><\/p><\/li><\/ol><h2 data-path-to-node=\"14\"><span style=\"color: #000000;\">Key Benefits of Using Tendify\u2019s Demurrage Tool<\/span><\/h2><h3 data-path-to-node=\"15\"><span style=\"color: #000000;\">1. Accurate Multi-Container &amp; Multi-Currency Processing<\/span><\/h3><p data-path-to-node=\"16\"><span style=\"color: #000000;\">Unlike basic spreadsheets, our system seamlessly processes complex container batches. Since specialized equipment like <b data-path-to-node=\"16\" data-index-in-node=\"119\">Reefer containers<\/b> incur substantially higher daily tariffs due to power requirements, our calculator auto-adjusts logic baselines to preserve strict auditing accuracy across major currencies.<\/span><\/p><h3 data-path-to-node=\"17\"><span style=\"color: #000000;\">2. Progressive Slab Calculations (Tiered Logic)<\/span><\/h3><p data-path-to-node=\"18\"><span style=\"color: #000000;\">Most global shipping lines (such as MSC, Maersk, and CMA CGM) do not charge flat penalties; they use progressive tiers. This calculator handles multi-level slab structures flawlessly, instantly mapping out exact costs over shifting timelines.<\/span><\/p><h3 data-path-to-node=\"19\"><span style=\"color: #000000;\">3. Visual Supply Chain Timeline<\/span><\/h3><p data-path-to-node=\"20\"><span style=\"color: #000000;\">The built-in <b data-path-to-node=\"20\" data-index-in-node=\"13\">Journey Progress Tracker<\/b> provides an instant visual distinction between your safe contractual window (Free Period) and the exact moment your container enters the high-risk financial zone (Overdue Period).<\/span><\/p><h3 data-path-to-node=\"21\"><span style=\"color: #000000;\">4. Direct Export and Reporting Capabilities<\/span><\/h3><p data-path-to-node=\"22\"><span style=\"color: #000000;\">Need to quickly justify logistics budgets or share a cost warning with your operations team? Use our single-click <b data-path-to-node=\"22\" data-index-in-node=\"114\">\"Copy Report\"<\/b> utility to format a clean text overview ready to be pasted into emails, WhatsApp, or Slack, or export the complete audited sheet using the <b data-path-to-node=\"22\" data-index-in-node=\"267\">\"Print Details\"<\/b> function.<\/span><\/p><blockquote data-path-to-node=\"24\"><h3 data-path-to-node=\"24,0\"><span style=\"color: #000000;\">\ud83d\udca1 Pro-Tip to Mitigate Port Fees<\/span><\/h3><p data-path-to-node=\"24,1\"><span style=\"color: #000000;\">Always audit your carrier invoices! Ocean freight lines frequently make invoicing errors regarding weekend gate closures or official port congestions. Use this tool as your benchmark reference to dispute unfair, erroneous demurrage charges confidently.<\/span><\/p><\/blockquote>\n\t\t\t\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\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Track your container free-time and calculate progressive port penalties with Tendify\u2019s real-time Shipping Demurrage &#038; Detention Calculator. Try it now!<\/p>","protected":false},"author":15,"featured_media":18492,"comment_status":"open","ping_status":"closed","sticky":false,"template":"elementor_theme","format":"standard","meta":{"footnotes":""},"categories":[767],"tags":[965],"class_list":["post-18491","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-b2b-online-tools","tag-container"],"_links":{"self":[{"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/posts\/18491","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/users\/15"}],"replies":[{"embeddable":true,"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/comments?post=18491"}],"version-history":[{"count":3,"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/posts\/18491\/revisions"}],"predecessor-version":[{"id":18495,"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/posts\/18491\/revisions\/18495"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/media\/18492"}],"wp:attachment":[{"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/media?parent=18491"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/categories?post=18491"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tendify.net\/ar\/wp-json\/wp\/v2\/tags?post=18491"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}