.elementor-10988 .elementor-element.elementor-element-5aaacdc{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-10988 .elementor-element.elementor-element-a15c517{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10988 .elementor-element.elementor-element-bb19761{width:initial;max-width:initial;}.elementor-10988 .elementor-element.elementor-element-7b8bd1e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:40px 40px;--row-gap:40px;--column-gap:40px;border-style:solid;--border-style:solid;border-width:0px 1px 0px 1px;--border-top-width:0px;--border-right-width:1px;--border-bottom-width:0px;--border-left-width:1px;border-color:#CECECE;--border-color:#CECECE;--border-radius:0px 0px 0px 1px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10988 .elementor-element.elementor-element-2a7ce97{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--overlay-opacity:1;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10988 .elementor-element.elementor-element-2a7ce97:not(.elementor-motion-effects-element-type-background), .elementor-10988 .elementor-element.elementor-element-2a7ce97 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://eacomm.com/wp-content/uploads/2025/11/image-2.png");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-10988 .elementor-element.elementor-element-2a7ce97::before, .elementor-10988 .elementor-element.elementor-element-2a7ce97 > .elementor-background-video-container::before, .elementor-10988 .elementor-element.elementor-element-2a7ce97 > .e-con-inner > .elementor-background-video-container::before, .elementor-10988 .elementor-element.elementor-element-2a7ce97 > .elementor-background-slideshow::before, .elementor-10988 .elementor-element.elementor-element-2a7ce97 > .e-con-inner > .elementor-background-slideshow::before, .elementor-10988 .elementor-element.elementor-element-2a7ce97 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(180deg, #FFFFFF00 0%, var( --e-global-color-de93f83 ) 100%);}.elementor-10988 .elementor-element.elementor-element-6659f77{--display:flex;--overlay-opacity:0.5;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:20px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-10988 .elementor-element.elementor-element-6659f77::before, .elementor-10988 .elementor-element.elementor-element-6659f77 > .elementor-background-video-container::before, .elementor-10988 .elementor-element.elementor-element-6659f77 > .e-con-inner > .elementor-background-video-container::before, .elementor-10988 .elementor-element.elementor-element-6659f77 > .elementor-background-slideshow::before, .elementor-10988 .elementor-element.elementor-element-6659f77 > .e-con-inner > .elementor-background-slideshow::before, .elementor-10988 .elementor-element.elementor-element-6659f77 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(180deg, #FFFFFF6B 0%, var( --e-global-color-de93f83 ) 100%);}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-10988 .elementor-element.elementor-element-cfc860f .elementor-button{background-color:var( --e-global-color-449c561 );}.elementor-10988 .elementor-element.elementor-element-cfc860f > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-10988 .elementor-element.elementor-element-cfc860f.elementor-element{--align-self:flex-end;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-10988 .elementor-element.elementor-element-1fc7b19 .elementor-heading-title{color:var( --e-global-color-secondary );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-10988 .elementor-element.elementor-element-dd81fbd{--divider-border-style:solid;--divider-color:var( --e-global-color-text );--divider-border-width:1px;}.elementor-10988 .elementor-element.elementor-element-dd81fbd .elementor-divider-separator{width:100%;}.elementor-10988 .elementor-element.elementor-element-dd81fbd .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-10988 .elementor-element.elementor-element-9ce23b5{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-10988 .elementor-element.elementor-element-233701e .elementor-icon-wrapper{text-align:center;}.elementor-10988 .elementor-element.elementor-element-233701e.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-text );}.elementor-10988 .elementor-element.elementor-element-233701e.elementor-view-framed .elementor-icon, .elementor-10988 .elementor-element.elementor-element-233701e.elementor-view-default .elementor-icon{color:var( --e-global-color-text );border-color:var( --e-global-color-text );}.elementor-10988 .elementor-element.elementor-element-233701e.elementor-view-framed .elementor-icon, .elementor-10988 .elementor-element.elementor-element-233701e.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-text );}.elementor-10988 .elementor-element.elementor-element-233701e .elementor-icon{font-size:20px;}.elementor-10988 .elementor-element.elementor-element-233701e .elementor-icon svg{height:20px;}.elementor-10988 .elementor-element.elementor-element-40c2873{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:40px;--padding-right:40px;}.elementor-10988 .elementor-element.elementor-element-e14e522{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10988 .elementor-element.elementor-element-5aff6f5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}@media(min-width:768px){.elementor-10988 .elementor-element.elementor-element-a15c517{--width:15%;}.elementor-10988 .elementor-element.elementor-element-7b8bd1e{--width:85%;}.elementor-10988 .elementor-element.elementor-element-6659f77{--width:100%;}.elementor-10988 .elementor-element.elementor-element-e14e522{--width:15%;}}@media(max-width:767px){.elementor-10988 .elementor-element.elementor-element-5aaacdc{--width:100%;}.elementor-10988 .elementor-element.elementor-element-a15c517{--width:100%;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-10988 .elementor-element.elementor-element-bb19761{width:initial;max-width:initial;}.elementor-10988 .elementor-element.elementor-element-7b8bd1e{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10988 .elementor-element.elementor-element-40c2873{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS for html, class: .elementor-element-3e33453 */:root {
            --mcd-red: #DB0007;
            --mcd-yellow: #FFBC0D;
            --dark-gray: #292929;
            --light-bg: #f4f7f6;
            --white: #ffffff;
            --border: #e0e0e0;
            --emergency: #dc3545; /* Source 38: Emergency Severity */
            --high: #fd7e14;      /* Source 38: High Severity */
            --medium: #ffc107;    /* Source 38: Medium Severity */
            --low: #28a745;       /* Source 38: Low Severity */
        }

      
        .brand { padding: 20px; font-size: 1.2rem; font-weight: bold; border-bottom: 1px solid #444; display: flex; align-items: center; gap: 10px; }
        .brand span { color: var(--mcd-yellow); }
        .nav-link { padding: 12px 20px; color: #ccc; text-decoration: none; display: flex; justify-content: space-between; align-items: center; transition: 0.2s; border-left: 4px solid transparent; }
        .nav-link:hover, .nav-link.active { background: #3a3a3a; color: white; border-left-color: var(--mcd-red); }
        .nav-header { font-size: 0.75rem; text-transform: uppercase; color: #777; padding: 15px 20px 5px; }

        /* --- Main Content --- */
        main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
        
        header { background: white; padding: 15px 30px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border); }
        .system-status { font-size: 0.85rem; color: #666; display: flex; gap: 15px; }
        
        .dashboard-content { padding: 30px; overflow-y: auto; flex: 1; }

        /* --- KPI Cards [Source 53] --- */
        .kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 20px; }
        .card { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); border-top: 4px solid transparent; }
        .kpi-title { font-size: 0.8rem; color: #666; text-transform: uppercase; margin-bottom: 5px; }
        .kpi-val { font-size: 1.8rem; font-weight: bold; color: #333; }

        /* --- Ticket Table [Source 17, 60] --- */
        .table-container { 
            background: white; 
            border-radius: 8px; 
            box-shadow: 0 2px 5px rgba(0,0,0,0.05); 
            overflow-x: auto; /* Enables horizontal scrolling */
    -webkit-overflow-scrolling: touch;
            
        }
        .toolbar { padding: 15px; border-bottom: 1px solid #eee; display: flex; gap: 15px; flex-wrap: wrap; }
        
        table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
        th { background: #f8f9fa; padding: 12px 15px; text-align: left; color: #555; border-bottom: 2px solid #ddd; }
        td { padding: 12px 15px; border-bottom: 1px solid #eee; vertical-align: middle; }
        tr:hover { background-color: #fafafa; cursor: pointer; }

        /* Badges */
        .badge { padding: 4px 10px; border-radius: 12px; font-size: 0.75rem; font-weight: bold; text-transform: uppercase; color: white; }
        .sev-emergency { background: var(--emergency); }
        .sev-high { background: var(--high); }
        .sev-medium { background: var(--medium); }
        .sev-low { background: var(--low); }
        
        .status-open { background: #e2e6ea; color: #333; }
        .status-progress { background: #cce5ff; color: #004085; }
        .status-resolved { background: #d4edda; color: #155724; }

        /* --- Ticket Modal [Source 46, 47] --- */
        .modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 100; justify-content: center; align-items: center; }
        .modal { background: white; width: 800px; max-height: 90vh; border-radius: 8px; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 10px 25px rgba(0,0,0,0.2); }
        .modal-header { padding: 20px; background: #333; color: white; display: flex; justify-content: space-between; align-items: center; }
        .modal-body { padding: 20px; overflow-y: auto; flex: 1; display: grid; grid-template-columns: 2fr 1fr; gap: 20px; }
        
        .ticket-detail-group { margin-bottom: 15px; }
        .label { font-size: 0.8rem; color: #888; display: block; margin-bottom: 5px; }
        .value { font-weight: 600; font-size: 0.95rem; }

        .chat-log { background: #f9f9f9; border: 1px solid #eee; padding: 15px; height: 200px; overflow-y: auto; margin-bottom: 15px; border-radius: 4px; }
        .msg { margin-bottom: 10px; font-size: 0.85rem; }
        .msg strong { color: var(--mcd-red); }

        textarea, select, input { width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px; margin-bottom: 10px; box-sizing: border-box; }
        
        .btn { padding: 8px 16px; border: none; border-radius: 4px; cursor: pointer; font-weight: bold; }
        .btn-close { background: transparent; color: white; font-size: 1.2rem; }
        .btn-resolve { background: var(--low); color: white; width: 100%; }

        @media (max-width: 900px) {
            .kpi-row { grid-template-columns: 1fr 1fr; }
            .modal-body { grid-template-columns: 1fr; }
            aside { display: none; }
        }/* End custom CSS */
/* Start custom CSS */.figures {
           font-size: 2em;
           font-weight: bold;
       }
        .container {
            max-width: 900px;
            background: #fff;
            margin: 20px;
            padding: 25px;
            border-radius: 12px;
            box-shadow: 0 4px 20px rgba(0,0,0,0.1);
        }
        h1 {
            text-align: center;
            color: #c60000;
        }
        .section-title {
            font-weight: bold;
            font-size: 1.2rem;
            margin-top: 25px;
            color: #444;
        }
       .grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
            gap: 5px;
        }
        label {
            font-size: 0.9rem;
            color: #555;
        }
        input[type="text"], input[type="number"], select, input[type="file"] {
            width: 100%;
            padding: 10px;
            border-radius: 6px;
            border: 1px solid #ccc;
            margin-top: 5px;
        }
        button {
            background: #c60000;
            border: none;
            padding: 12px 18px;
            border-radius: 8px;
            color: white;
            cursor: pointer;
            margin-top: 20px;
            font-size: 1rem;
        }
        button:hover {
            background: #a30000;
        }
        .file-note {
            font-size: 0.8rem;
            color: #777;
            margin-top: 5px;
        }
        .error {
            color: red;
            font-size: 0.85rem;
        }
        .cards {
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
            margin-top: 20px;
        }
        .card {
            flex: 1 1 250px;
            background: #f0f0f0;
            padding: 15px;
            border-radius: 10px;
            text-align: center;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
        }
        .card h3 {
            margin: 0;
            color: #c60000;
        }/* End custom CSS */