/* login page */

html:not(.dark-mode) body.login-page {
    background: #f8f8f8 !important;
}

body.login-page {
   padding: 0 15px;
}

body.login-page #layout #layout-content {
    margin-top: 5rem !important;
    padding: 35px 40px 40px 40px !important;
}

body.login-page #logo {
   width: 40% !important;
   padding-top: 10px !important;
   padding-bottom: 25px !important;
}

body.login-page #login-form {
   overflow: visible;
   color: #333;
   max-width: 100%;
   line-height: 1.5rem !important;
} 

body.login-page #login-form table tr.row td {
   padding-bottom: 0px !important;
}

body.login-page #login-banner {
   font-size: 1.3rem;
   background-color: #f5f5f5;
   padding: 10px;
   margin-bottom: 15px;
}

html.dark-mode body.login-page #login-banner {
   opacity: 0.8;
}

body.login-page #login-form input[type='text'], body.task-login #login-form input[type='password'], body.task-login #login-form select {
   border-radius: 0 !important;
   font-size: 1.25rem !important;
   width: 100%;
}
body.task-login #login-form .formbuttons {
   margin-bottom: 10px !important;
   margin-top: 15px !important;
}

label[for=rcmloginuser],label[for=rcmloginpwd],label[for=_language] {
   display: none !important;
}

button#rcmloginsubmit.button {
   padding-top: 0.6rem !important;
   padding-bottom: 0.6rem !important;
   border-radius: 0 !important;
   background-color: #0075C8 !important;
   text-transform: none !important;
   font-size: 1.2rem !important;
   line-height: 1.5rem !important;
}

html.dark-mode button#rcmloginsubmit.button {
   opacity: 0.8;
}

button#rcmloginsubmit.button:hover {
   background-color: #138BE1 !important;
}

/* navigation sidebar on the left */
body.xskin.skin-gmail_plus div#layout-menu {
   order: 0 !important;
}

body.xskin.skin-gmail_plus div#layout-sidebar:not(.sidebar-right) div.scroller {
   border-left: 1px solid #eee !important;
}

body.xskin.skin-gmail_plus div#layout-content div#compose-content {
   border-left: 1px solid #eee !important;
}

body.xskin.skin-gmail_plus div.footer:not(.pagenav) {
   border-left: 1px solid #eee !important;
}

body.xskin.skin-gmail_plus div#taskmenu span.special-buttons {
   left: 0 !important;
}

#taskmenu .special-buttons {
   right: unset !important;
}

/* UX tweaks */
/* hide appearance settings */
li#settingstabresponses {
   display: none !important;
}

/* hide sidebar settings */
/*
tr#rcmrowxsidebar {
   display: none !important;
}
*/

tr#rcmrowxskin {
   display: none !important;
}

#toolbar-menu li a[href="#responses"] {
   display: none !important;
}

/* fix checkbox colors */
.custom-switch .custom-control-input:checked:enabled ~ .custom-control-label::before {
   border-color: #0076c6 !important;
   background-color: #0076c6 !important;
}

.xcolor-0075c8 .custom-switch .custom-control-input:checked:disabled ~ .custom-control-label::before {
   border-color: #84d7ff !important;
   background-color: #84d7ff !important;
}

/* add padding to logo */
#layout-menu .popover-header img {
   /* padding: .5rem !important; */
   padding: 1rem 0.5rem !important;
}

/* fix logo on iphone */
@supports (-webkit-touch-callout: none) {
    #layout-menu .popover-header img {
    /* CSS specific to iOS devices */ 
    padding: 1rem 0rem !important;
    }
}

/* fix logo on mobile and tablet */
@media screen and (min-width: 481px) and (max-width: 1024px) {
    #layout-menu .popover-header img {
    display: none !important;
    }
}

.layout-phone #xlogo-header {
   padding-top: 0.6rem !important;
   padding-bottom: 0.6rem !important;
}

/* fix compose button */
.action-buttons a.compose {
   display: block !important;
}

#compose-plus {
   display: none !important;
}

body.login-page #layout #layout-content {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important;
    padding: 35px 40px 40px 40px !important;
}

body.xskin.login-page #login-footer, 
body.xskin.login-page #bottomline {
    padding: 8px 15px;
}


form .g-recaptcha {
    transform: scale(1.117);
    -webkit-transform: scale(1.117);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
}

@media only screen and (max-width: 950px) and (orientation: landscape) {
    
    body.task-login #layout #layout-content {
        padding: 20px 40px 35px;
       -webkit-transform: scale(.65) translate(0, -30%);
           -ms-transform: scale(.65) translate(0, -30%);
               transform: scale(.65) translate(0, -30%);
   }

    body.login-page #layout #layout-content {
        margin-top: 2.5rem !important;
    }
   
    body.login-page #logo {
       width: 35% !important;
       padding-top: 0px !important;
       padding-bottom: 15px !important;
    }   
}


@media only screen and (max-width: 570px) and (orientation: landscape) {

    body.task-login #layout #layout-content {
        -webkit-transform: scale(.55) translate(0, -45%);
            -ms-transform: scale(.55) translate(0, -45%);
                transform: scale(.55) translate(0, -45%);
    }
}


@media screen and (min-width: 481px) {
    #taskmenu a span.inner {
       left: 10% !important;
       right: unset !important;
    }
}


/* scale captcha on mobile */

@media only screen and (max-width: 450px) { 
    form .g-recaptcha {
        transform: scale(1);
        -webkit-transform: scale(1);
        transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
    }
} 



@media only screen and (max-width: 370px) { 
    form .g-recaptcha {
        transform: scale(.85);
        -webkit-transform: scale(.85);
        transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
    }
} 
