.ui-widget-content-a

{

    background-image: none;

    color: #283533;

    background-color: #E6E7E7;

    border: none;

}

.ui-widget-content-a .Month,.ui-widget-content-a .StandardFilters,.ui-widget-content-a .CustomFilters

{

    padding-left:5px;

}

/* Header */

.DropDownFilter {

    position: relative;

    z-index: 10;

}

.DropDownFilter .DatePickerButtonGroup

{

    background-color: #ffffff;

}

.DatePickerButton .ui-button-text { padding: 4px; }

.ui-dialog .ui-dialog-titlebar-close

{

    height: 16px;

    width: 16px;

}

.PortalMenuText

{

    color: #131619;

}

#UserActivityFilters fieldset legend { color: White; }

/* Logon */

html

{

    height: 100%;

}
 
#logon

{

    position: relative;

}
 
#logon .panel-header

{

  margin-bottom: 75px;

}
 
/* Layout: SSO at top, OR divider, then username/password form, then Login button */

#logon form

{

    display: flex;

    flex-direction: column;

}
 
/* Move SSO button to top of the form */

#logon .buttons:has(#GoToSingleSignOn)

{

    order: -1;

}
 
/* OR divider below SSO button, above username/password fields */

#logon .buttons:has(#GoToSingleSignOn)::after

{

    content: 'OR';

    display: block;

    text-align: center;

    color: #283533;

    font-size: 0.85em;

    padding: 8px 0;

    background-image:

        linear-gradient(#283533, #283533),

        linear-gradient(#283533, #283533);

    background-size: calc(50% - 20px) 1px;

    background-repeat: no-repeat, no-repeat;

    background-position: left center, right center;

}
 
 
 
/* Do not override the Mobile Css rules */

@media only screen and (min-device-width: 480px)

{

    #logon.LogonPanel

    {

        position: static;

        margin: auto;

        font-size: 1em;

        border-radius: 8px;

        height: 100%;

        width: 280px;

    }

    .Logon #PasswordWrapper

    {

        width: 100%;

    }

    .Logon #main

    {

        margin: 0px;

    }

    #logon .buttons

    {

        right: inherit;

        width: 100%;

        margin: 0px;

    }

    #logon.LogonPanel input[type=button]

    {

        width: 100%;

        height: 36px;

        background: #ffffff;

        border: 1px solid #000000;

        color: #000000;

        border-radius: 35px;

        font-size: 1em;

        margin-top: 8px;

    }

    #logon #UserName,

    #logon #Password

    {

        text-align: left;

    }

    input:focus

    {

        outline: none;

        box-shadow: 0 1px 0 0 black;

    }

    #logon.LogonPanel input[type='text'],

    #logon.LogonPanel input[type='password'],

    #logon.LogonPanel input[type='email']

    {

        height: 34px;

        margin: 0px;

        padding: 0px;

        padding-top: 3px;

        padding-bottom: 3px;

        margin-bottom: 16px;

        width: 100%;

        background-color: rgb(255,255,255) !important;

        border-bottom: 1px solid black !important;

        border: 0px solid black;

        border-radius: 0px;

    }

    #logon.LogonPanel .buttons input[type='submit']

    {

        width: 100%;

        height: 36px;

        background: #ffffff;

        border: 1px solid #FFFFFF;

        color: #000000;

        border-radius: 35px;

        font-size: 1em;

    }

    #logon.LogonPanel #Login

    {

        width: 100%;

        height: 36px;

        background: #ffffff;

        border: 1px solid #FFFFFF;

        color: #000000;

        border-radius: 35px;

        font-size: 1em;

    }

    input:-webkit-autofill

    {

        box-shadow: 0 0 0px 1000px white inset;

    }

}

.KoTable

{

    border-collapse:separate;

    border:solid rgb(78,115,127) 2px;

    border-radius:1px;

    width: 100%;

}

.KoTable th

{

    color: white;

}

/* DataTables */

.TFPPanel,

table.TFPTable

{

    background-color: #acacac;

}

/* Side border colors between header and footer */

.dataTables_wrapper.FullScreen {

    position: fixed;

    top: 100px;

    left: 10px;

    right: 10px;

    z-index: 5;

}

.dataTables_wrapper .ui-widget-header,

.dataTables_wrapper .dataTables_scrollHeadInner

{

    background-image: none;

    background-color: #ACACAC;

}

/* Icon colors */

.TFPTable td .ButtonList li .ui-icon { background-image: url(../Content/images/ui-icons_000000_256x240.png); }

.ui-icon.Disabled,

.TFPTable td .ButtonList li.Disabled .ui-icon

{ background-image: url(../Areas/Core/Content/Images/ui-icons_cccccc_256x240.png); }

thead.DataTableThead.ui-widget-header, .dataTable.ui-widget-content { border: none; }

button, .ui-button span, input[type='submit'], input[type='button'] { font-size: 0.9em; }

/* Custom fonts */

@font-face

{

    font-family: 'InterRegular';

    src: url('../Content/Fonts/Inter-Regular.ttf') format('truetype');

    font-weight: normal;

    font-style: normal;

}

@font-face

{

    font-family: 'InterBold';

    src: url('../Content/Fonts/Inter-Regular.ttf') format('truetype');

    font-weight: 500;

    font-style: normal;

}

/* Use bold font instead of making the regular font bold */

table thead th,

table td.bold,

.ui-toolbar .dataTables_info .Bold,

.TFPTable thead th,

.TFPTable tfoot tr td.GuaranteedHours,

.outerscrolltable thead th,

.outerscrolltable2 div.SchedulingGroup,

h1,

H2,

H3,

H4,

.h4,

.PortalGridMenuText,

.PortalMenuText,

.MenuItem,

td.eventsOnTrip,

td.driverAssigned,

#ordersPanel #unresolvedTable td.releaseOveraccounted,

#ordersPanel #unresolvedTable td.releaseUnaccounted,

#terminalCalendarDetailsPanel .terminalCalendarDetailsTitle,

div#NotificationTable table td,

#GreenergyCustomerWelcomeScreen span.NotificationDate,

.ui-widget-header,

b,

caption,

.ui-toolbar .LengthWrapper ul li.ui-selected,

.VerticalLabelValue .Head,

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current,

#viewDeleteDetails div.AssociatedRolesMessage,

.DashboardButtons li,

.KOLabelTable .KOLabelText,

.KOLabelTable .KOLabelSubText,

.KOLabelTable .KOLabelHeader,

#dropboxDiv

{

    font-family: InterRegular,sans-serif;

    font-weight: 600;

}

#title { background-color: #131619; }

.ui-widget-footer{ background-color: #ACACAC !important; }

#menucontainer #menu .submenu { border: 1px solid white; }

.IconWrapper { height: 20px; }

.TripPatternSegmentField {

    display: inline-flex;

    padding-bottom: 2px;

    padding-top: 2px;

}

.TripPatternSegmentField .Value {

    width: 180px;

}

.IconWrapper { height: 20px; }

.VehiclesWithTripTodayCheckboxCell {

    text-align: right;

}

.NoDeviations {

    color: green;

}

.HasDeviations{ color:red;}

.UserSettingsDialog label {

    width:100px;

}

.UserSettingsDialog .Value select {

    width:175px;

}

#PluginDialog .Header

{

    width: 220px;

}

#PluginDialog .Value input

{

    width: 300px;

}

/***** TEMPLATE TO ADJUST CSS FOR CUSTOM STYLING *****/

/***** REGION: LOGON PAGE *****/

/** Adjust Logon Page Background **/

body.Logon

{

    background: radial-gradient(circle farthest-corner at bottom, #64b4af 20%, #092b44 120%) no-repeat fixed;

    background-size: 100%;

}

/** Hide Default Logon Logo **/

#logon img[alt="AMCS Web Portal"]

{

    visibility: hidden;

}

/** Replace Default Logon Menu Logo **/

#logon .panel-header

{

    background: url('/OverrideContent/Images/PetronasLogo.png') no-repeat center;

    background-size: contain;

}

/** Replace Default Logon Button Color **/

#logon.LogonPanel #Login,

#logon.LogonPanel #GoToSingleSignOn

{

    background: #4b9b7f;

    border: 1px solid #FFFFFF;

    color: #FFFFFF !important;

}

/***** END REGION: LOGON PAGE *****/

/***** START REGION: HOME PAGE *****/

/** Adjust Home Page Background */

body

{

    background: radial-gradient(circle farthest-corner at bottom, #64b4af 20%, #092b44 120%) no-repeat fixed;

    background-size: 100%;

}

/** Navbar Adjustments **/

#header.ui-widget-header

{

    border: none;

    background-color: transparent;

}

#header #menu

{

    top: 75px;

}

#title

{

    background-color: transparent;

}

/** Navbar Logo **/

#logo > a

{

    background: url(/OverrideContent/Images/PetronasLogo.png);

    background-size: contain;

    background-repeat: no-repeat;

    width: 75px;

    height: 75px;

    position: absolute;

    display: block;

    left: 70px;

    top: 40px;

}

/** Grid Layout Adjustments **/

#PortalButtonList

{

    margin-top: 60px;

    padding: 25px;

}

/***** END REGION: HOME PAGE *****/

/** Footer default properties **/

footer

{

    position: fixed !important;

    z-index: 100 !important;

}

/** Dropdown Frame **/

.DropDownFrame

{

    position: static;

}
 
/* Ensure the pageheader spans the full width of the page */

#pageheader {

    width: 100%;

}
 
/* Position the ROUTES dropdown */

.HeaderElm.DropDownButton {

    position: relative;

    left: 50%;

    transform: translateX(-40%);

}
 
/* Center and reduce the width of RoutesViewFilter to 60% */

#RoutesViewFilter {

    width: 62%;

    margin: 0 auto;

}
 
#RoutesTable_wrapper {

    margin-top: 30px; /* Adjust the value as needed */

}

 