/* These styles override Polymer's own internal styling for certain elements to
   suit LOOT's needs. */

/* Transition icon button colour over same time period that plugin cards flip. */
paper-icon-button[disabled] {
    transition: color 0.6s;
}
/* This override change the positioning of the progress dialog to adapt to content changes. */
#progressDialog {
    position: inherit !important;
    margin: 0 auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
/* This makes checkboxes have the same padding as icons in lists. */
html /deep/ core-menu paper-checkbox::shadow #checkboxLabel {
    padding-left: 32px;
}
/* Set the sidebar checkboxes to have balanced padding on either side. 32px
   makes the label just seem too far away. */
#filters paper-checkbox::shadow #checkboxLabel {
    padding-left: 16px;
}
/* Set the underline colour of focussed paper inputs. */
html /deep/ paper-input-decorator::shadow .underline .focused-underline {
    /* line color when the input is focused */
    background-color: #64B5F6;
}
/* Set the tab colours. */
html /deep/ paper-tabs::shadow #selectionBar {
    background-color: #64B5F6;
}
html /deep/ paper-tab::shadow #ink {
    color: #64B5F6;
}
/* Set the paper tab scroll buttons so they don't cause the cursor to display as
   as a pointer when they are disabled. */
html /deep/ paper-tabs::shadow .scroll-button .hidden {
    pointer-events: none;
}
/* Set the drawer z-index so that it doesn't appear below plugin cards. */
core-drawer-panel::shadow #drawer {
    /* max-width disabled because the panel doesn't shift over when the max
    is reached, due to the percentage drawer width, and setting it to a
    constant 400px is too wide in many window sizes. */
    /*max-width: 400px;*/
    z-index: 1;
}
/* Align dropdown label text with the descriptive text beside it. */
#settingsDialog loot-dropdown-menu::shadow paper-dropdown-menu {
    padding-top: 4px;
}
/* Add a transition to the core-tooltip tooltips. */
html /deep/ core-tooltip::shadow .core-tooltip {
    opacity: 0;
    transition: opacity 0.3s, visibility 0s 0.3s;
}
html /deep/ core-tooltip:hover:not([disabled])::shadow .core-tooltip {
    opacity: 1;
    transition-delay: 0s;
}

/* The max-height doesn't allow for expansion into newly-created scroll space. */
#main /deep/ paper-dropdown::shadow #scroller {
    max-height: none !important;
}

/* Don't center the "Jump to General Information" or active plugin tooltips, as
   they can get cut off by the sidebar. */
#drawerToggle + core-tooltip::shadow #tooltip,
loot-plugin-card /deep/ #activeTick::shadow #tooltip {
    left: inherit !important;
}

/* Style the paper-checkbox background. */
html /deep/ paper-checkbox::shadow #checkbox.checked {
    border-color: #3F51B5;
    background-color: #3F51B5;
}

/* Style the paper-toggle-button colours. */
html /deep/ paper-toggle-button::shadow [checked] .toggle-bar {
    background-color: rgba(63, 81, 181, 0.5);
}
html /deep/ paper-toggle-button::shadow [checked] .toggle-button {
    background-color: #3F51B5;
}
html /deep/ paper-toggle-button::shadow [checked] .toggle-ink {
    color: #3F51B5;
}
