@import url(./report_templates.css);
@import url(./bng-filter.css);
@import url(./accessibility-plugin.css);

/* Core styling overwrite for hotfixes */

.card-form-preview-container {
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    background: #ebeef0;
    overflow-y: auto;
    overflow-x: hidden;
}

/* End core styling overwrite for hotfixes*/

header {
    max-width: calc(100vw - 50px);
}

.workflow-panel.navbarclosed {
    min-width: 50px;
    width: 50px;
}

.navbarclosed li.workflow-main-nav-item {
    text-align: center;
    padding-left: 0;
    margin-left: 0px;
    height: 45px;
    border-left: 4px solid transparent;
}

.navbarclosed .workflow-main-nav-item > a span {
    display: none;
}

.nav-tooltip {
    display: none;
}

.navbarclosed .workflow-main-nav-item:hover .nav-tooltip {
    display: table-cell;
    background: #26476a;
    padding: 12px 20px;
    position: relative;
    top: -30px;
    left: 46px;
    width: auto;
    height: 45px;
    white-space: nowrap;
    z-index: 100;
}

.plugin-main {
    background: #f9f9f9;
}

.cons-search-results-container .search-result {
    margin-left: 0px;
    height: 60px;
    padding: 11px 10px 11px 15px;
    position: relative;
    background: #fbfbfb;
}

.cons-search-results-container .search-result:hover {
    background: #fff;
    border-bottom: 1px solid steelblue;
}

.cons-search-results-container .search-result:hover .search-result-info {
    width: 325px;
}

.search-result-info {
    width: 365px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-result-resource-name {
    font-size: 14px;
    font-weight: 600;
    color: #416284;
    line-height: .79;
}

.search-result-info a:hover {
    color: #2e29da;
}

.cons-type {
    font-size: 13px;
    font-weight: 400;
    color: #777;
    margin-top: -2px;
}

.cons-search-results-container .search-result:hover .cons-search-popup-link {
    display: block;
}

.cons-search-popup-link {
  position: absolute;
  left: 343px;
  top: 0px;
  width: 56px;
  height: 58px;
  background: #f2f2f2;
  border-left: 1px solid #ddd;
  padding: 15px 19px;
  font-size: 19px;
  font-weight: 400;
  display: none;
}

.cons-search-popup-link:hover {
    cursor: pointer;
}

.tabbed-workflow-footer-button-container .btn-success:focus {
    background: #CEF1AA;
    color: #508A14;
}

.tabbed-workflow-footer-button-container .btn-primary:focus {
    background: #B0D4F5;
    color: #156AB7;
}

.tabbed-workflow-footer-button-container .btn-danger:focus {
    background: #FFA08E;
    color: #B02107;
}

.workflow-top-control .btn-danger:focus {
    background: #FFA08E;
    color: #B02107;
}

.workflow-top-control .btn-success:focus {
    background: #CEF1AA;
    color: #508A14;
}

div.workflow-content {
    flex-grow: 2;
    background: #fafafa;
}

.workflow-panel-nav-header a span i {
    padding-left: 10px;
}

.navbarclosed .workflow-panel-nav-header a span i {
    padding-left: 10px;
}

.workflow-panel-nav-header a span {
    font-size: 17px;
    font-weight: 600;
    color: white;
    margin-left: 10px;
    padding-right: 10px;
    width: 100%;
}

.workflow-panel-nav-header {
    padding-top: 12px;
    height: 50px;
    border-bottom: 1px solid #041B33;
}

.workflow-panel-nav-header:hover {
    cursor: pointer;
}

.workflow-panel-nav-header > hr {
    border-color: #142638;
    width: 100%;
}

.tabbed-workflow-title-bar {
    flex-direction: row-reverse;
}

.workflow-step-loading-mask {
    top: 95px;
}

.sub-title {
    font-weight: 600;
}

.dropzone-photo-upload {
    margin-top: 40px;
}

.photo-workbench-photo {
    position: relative;
    padding: 4px;
}

.photo-workbench-photo:nth-child(even) {
    background: #fff;
    border-bottom: 1px solid #D3E5F4;
}

.photo-workbench-photo:nth-child(odd) {
  background: #F5FAFE;
  border-bottom: 1px solid #D3E5F4;
}

.photo-workbench-photo.selected-photo {
    background-color: #9CC3E4;
    color: #fff;
    font-weight: 600;
    padding: 4px;
}

.photo-workbench-photo:not(.selected-photo):hover {
    background: #CAE2F5;
    cursor: pointer;
}

.card-display-panel {
    position: relative;
    width: calc(100% - 75px);
    min-height: 400px;
    height: inherit;
    top: 0px;
    left: 0px
}

.card-control-panel-tabs.nav.nav-tabs {
    background-color: #ccc;
    width: 55px
}

.card-control-panel-tabs.nav.nav-tabs li {
    background-color: #ccc;
    border-bottom: solid 1px #999;
    border-top: solid 1px #999;
    border-left: solid 1px #999;
    width: 55px;
}

.card-control-panel-tabs.nav.nav-tabs li.active {
    background-color: #fff;
    margin-left: -1px;
    width: calc(100% + 1px);
    border-left: 1px solid #fff;
}

.tab-container .nav-tabs li a {
    margin-right: 0px;
}

.gallery-container .tab-container .tab-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.tab-container {
    border-right: solid 1px #999;
    border-bottom: solid 1px #999;
    background-color: #ededed;
    height: -webkit-fill-available;
}

.card-control-panel .tab-pane {
    display: inline-flex;
}

/* workflows */
.workflows-get-tile-value {
    margin: 10px -10px 25px 20px;
    border: solid 1px #acf;
    padding: 20px 30px 40px 30px;
    max-width: 615px;
    background-color: #f3f3f3;
}

.workflows-get-tile-value h4 {
    margin-bottom: 3px;
    margin-left: 3px;
    font-size: 14px;
    font-weight: 500;
}

.workflows-get-tile-value > .checkbox {
    margin: 0;
    padding: 10px 5px 5px 5px;
    color: #777;
}

.workflows-add-reference-numbers {
    margin: 5px 25px;
    border: solid 1px #acf;
    padding: 10px;
    background-color: #fff;
}

/* In core core arches */

.projects-grid {
    margin-left: -10px;
}

.projects-grid .card-grid-item {
    margin: 10px;
    border: 1px solid #bbb;
}

.projects-grid .card-grid-item:hover {
    border: 1px solid steelblue;
}

.active-cons-container {
    margin: 65px 30px 30px 30px;
    overflow-y: scroll;
    width: 100%;
    height: calc(100vh - 160px);
}

.active-cons-container-header {
    position: absolute;
    width: 100%;
    margin: 0px;
    background: #f1f1f1;
    border-bottom: 1px solid #ddd;
}

.active-cons-filters {
    padding: 15px 10px 10px 30px;
    margin-bottom: 5px;
}

.active-cons-filters input {
    height: 32px;
    width: 291px;
    margin-right: 5px;
    padding-left: 5px;
}

.active-cons-filters input:focus {
    border: 1px solid steelblue;
    outline: unset;
    padding-left: 6px;
}

.active-cons-filters .filter {
    margin-top: -3px;
    height: 30px;
    padding-top: 3px;
    font-weight: 600;
    border-radius: 2px;
}

.active-cons-filters .reset {
    border-radius: 50%;
    padding: 0px 1px;
    height: 15px;
    width: 15px;
    position: absolute;
    top: 24px;
    left: 298px;
    font-size: 9px;
}

div.active-cons-header {
    border: solid 1px #454545;
    padding: 5px 10px;
    color: #fff;
    background: #454545;
    margin: -1px;
    height: 50px;
}

.active-cons-table-view {
    height: 57px;
    margin-bottom: 5px;
}

.active-cons-container-title {
    font-size: 17px;
    color: #585858;
    padding: 22px 45px;
    margin: 0px;
}

.active-cons-header-title {
    margin-top: 2px;
    font-weight: 600;
    font-size: 13px;
    text-align: center;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* div.active-cons-header ~ div div, div.active-cons-header ~ div p {
    overflow: hidden;
} */

div.active-cons-map-container {
    height: 200px;
    width: 288px;
    padding: 0px;
    text-align: center;
    background-color: #f8fbff;
    position: relative;
    margin-top: 1px;
}

.active-cons-map-container span {
    font-size: 8px;
}

div.active-cons-map {
    height:inherit;
    width:inherit;
}

div.active-cons-map > a > img {
    max-width: 100%;
    height: auto;
    z-index: -1;
}

img.active-cons-map-disabled {
    opacity: 0.2;
}

div.active-cons-map > div {
    z-index: 1;
    position: absolute;
    width: inherit;
    padding: 0 1px 0 4px;
    height: auto;
    top: 175px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-end;
}

div.active-cons-map > div > span {
    display: inline-block;
}

div.active-cons-stubs {
    border-bottom: solid 1px #ddd;
    display: flex;
    padding: 10px;
}

.active-cons-header.status-ok, .hover-feature-title-bar.status-ok {
    background: #9EE50F;
    color: #4A6F00;
    border: 1px solid #649600;
}

.card-grid-item:hover .active-cons-header.status-ok {
    border: 1px solid #25476A;
    border-bottom: 1px solid #649600;
}

.active-cons-header.status-late, .hover-feature-title-bar.status-late {
    background: #CD0074;
    color: #fff;
    border: 1px solid #7D0047;
}

.card-grid-item:hover .active-cons-header.status-late {
    border: 1px solid #25476A;
    border-bottom: 1px solid #7D0047;
}

#map-popup .status-warning .hover-feature-title {
    color: #9B9B00;
}

#map-popup .status-ok .hover-feature-title {
    color: #4A6F00;
}

#map-popup .status-late .hover-feature-title{
    color: #fff;
}

.active-cons-header.status-warning, .hover-feature-title-bar.status-warning {
    background: #FFFF1A;
    color: #9B9B00;
    border: 1px solid #bbb;
}

.active-cons-paginator {
    position: absolute;
    bottom: 0px;
    background: #f1f1f1;
    border-top: 1px solid #ddd;
    width: 100%;
}

.active-cons-paginator .pagination {
    margin: 5px 0px;
}

.card-grid-item:hover .active-cons-header.status-warning {
    border: 1px solid #25476A;
    border-bottom: 1px solid #bbb;
}

div.active-cons-stub-left {
    flex-grow: 1;
    border-right: solid 1px #ddd;
    text-align: center;
    width: 120px;
}

div.active-cons-stub-right {
    flex-grow: 1;
    text-align: center;
    width: 150px;
    padding-left: 3px;
}

div.ep-tools-title > div {
    font-size: 15px;
    padding: 12px 0px 0px 12px;
}

div.active-cons-stub-val {
    font-size: 13px;
    font-weight: 500;
    color: #25476A;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.active-cons-stub-label {
    font-size: 11px;
    color: #777;
}

.active-cons-stub-summary {
    font-size: 12px;
    color: #727272;
    height: 116px;
    padding: 10px 15px;
}

.osm-credit {
    padding-left: 50px;
}

.active-cons-stub-summary-text {
    width: 265px;
    overflow: hidden;
    height: 98px;
    /* white-space: nowrap;
    text-overflow: ellipsis; */
}

div.active-cons-hover-loading {
    position: absolute;
    font-size: 36px;
    align-self: center;
    /* display: inline-block; */
    /* text-align: center; */
    height: 55%;
    margin-left: 30%;
    text-align: center;
}

.active-cons-hover-loading i {
    display: inline-block;
}

.active-cons-table {
    padding: 10px 20px;
}

.active-cons-table .dataTables_info {
    margin-top: -5px;
}

.active-cons-table tr {
    height: 35px;
}

.active-cons-table input {
    margin-top: 0px;
}

.active-cons-table label {
    margin-top: -3px;
}

.active-cons-table p {
    max-width: 600px;
    margin-bottom: 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.active-cons-table tbody tr {
    background: #fff;
}

.active-cons-table tbody tr:nth-child(odd) {
    background: #F5FAFE;
    border-bottom: 1px solid #D3E5F4;
}

.active-cons-table .btn-group {
    margin-top: 0px;
}

.active-cons-table .row:first-child {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

.active-cons-table td {
    margin-top: 3px;
}

.active-cons-table .dataTables_paginate {
    position: fixed;
    bottom: 5px;
    right: 40px;
}

.active-cons-table .dataTables_info {
    position: fixed;
    bottom: 10px;
    left: 90px;
}

.workflow-main-nav-item {
    cursor: pointer;
    display: block;
}

.workflow-main-nav-item.active-sub {
    background-color: steelblue;
}

.workflow-main-nav-item.active-sub:hover {
    cursor: default;
    background: steelblue
}

li.workflow-main-nav-item a {
    display: block;
}

div.hide-completion-date > div > div > div > div > form > div > div:nth-child(5) {
    display: none;
}

div.show-only-details > div > div > div > div > form > div > div:nth-child(9),
div.show-only-details > div > div > div > div > form > div > div:nth-child(12),
div.show-only-details > div > div > div > div > form > div > div:nth-child(16) {
    display: none;
}

div.show-only-notes > div > div > div > div > form > div > div:nth-child(1),
div.show-only-notes > div > div > div > div > form > div > div:nth-child(2),
div.show-only-notes > div > div > div > div > form > div > div:nth-child(3),
div.show-only-notes > div > div > div > div > form > div > div:nth-child(4),
div.show-only-notes > div > div > div > div > form > div > div:nth-child(5),
div.show-only-notes > div > div > div > div > form > div > div:nth-child(12),
div.show-only-notes > div > div > div > div > form > div > div:nth-child(16) {
    display: none;
}

div.show-only-followup > div > div > div > div > form > div > div:nth-child(1),
div.show-only-followup > div > div > div > div > form > div > div:nth-child(2),
div.show-only-followup > div > div > div > div > form > div > div:nth-child(3),
div.show-only-followup > div > div > div > div > form > div > div:nth-child(4),
div.show-only-followup > div > div > div > div > form > div > div:nth-child(5),
div.show-only-followup > div > div > div > div > form > div > div:nth-child(9),
div.show-only-followup > div > div > div > div > form > div > div:nth-child(16) {
    display: none;
}

div.show-only-upload > div > div > div > div > form > div > div:nth-child(1),
div.show-only-upload > div > div > div > div > form > div > div:nth-child(2),
div.show-only-upload > div > div > div > div > form > div > div:nth-child(3),
div.show-only-upload > div > div > div > div > form > div > div:nth-child(4),
div.show-only-upload > div > div > div > div > form > div > div:nth-child(5),
div.show-only-upload > div > div > div > div > form > div > div:nth-child(9),
div.show-only-upload > div > div > div > div > form > div > div:nth-child(12) {
    display: none;
}

div.hide-full-address > div > div > div > div > form > div > div:nth-child(1) {
    display: none;
}

.ep-toolbar.cons {
    border-top: 1px solid #ddd;
    background: #f8f8f8;
    border-bottom: none;
}

.active-cons-footer {
  background: #444;
}

.cons .ep-tools-right {
    background: #f2f2f2;
    position: absolute;
    right: 0px;
    height: 49px;
}

.cons-owner-title-panel {
    padding: 0px 0px;
}

.cons-owner-title {
    padding: 15px;
    font-weight: 600;
}

.active-cons-map .map-credit a.mapboxgl-ctrl-logo {
    margin: -5px 0 -3px 3px;
}

a.mapboxgl-ctrl-logo {
    height: 17px;
    width: 170px;
}

.active-cons-table-container {
    padding: 20px 0px;
}

.active-cons-table-clip-field {
    width: 40%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.active-consultations-table-header {
    background: steelblue;
    color: #ddd;
}

table.dataTable thead .sorting_asc:after {
    color: #eee;
    opacity: 1;
}

table.dataTable thead .sorting:after {
    color: #eee;
    opacity: 1;
}

.active-consultations-table-header tr:first-child:hover {
    background-color: steelblue !important;
}

.active-consultations-sort {
    position: absolute;
    right: 100px;
    top: 15px;
}

.active-cons-table div.dataTables_wrapper div.dataTables_filter {
    text-justify: inherit;
    float: right;
    margin-right: 0px;
    margin-top: 3px;
}

.active-consultations-display {
    position: absolute;
    right: 20px;
    top: 12px;
    z-index: 300;
}

.active-consultations-display .btn {
    margin-right: -20px;
    color: #888;
}

.active-consultations-display .btn:hover {
    color:#041B33;
}

.active-consultations-display .btn:focus {
    color:#041B33;
}

.dataTables_wrapper .row {
    margin-top: 3px;
}

table.report-tabular-card {
    width: 80%;
    margin-top: 4px;
    /* padding-left: 40px;
    padding-right: 40px; */
}

.tabbed-workflow-step-body .photo-workbench-photos {
    margin-top: 10px;
}

.tabbed-workflow-step-body .workbench-card-sidepanel .install-buttons:not(.tabbed-workflow-step-body .workbench-card-sidepanel .create-resource-instance-card-component .install-buttons) {
    display: none;
}

.report-tabular-card td {
    padding: 4px;
    color: #a3a4a4;
    /* border-left:1px solid black;
    border-right:1px solid black; */
}

.report-tabular-card tr td:first-child {
    border-left:1px solid #dfdfdf;
}

.report-tabular-card tr td:last-child {
    border-right:1px solid #dfdfdf;
}

.report-tab-content-left-align {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* .report-tabular-card tr td:nth-child(even) {
    border-right:1px solid black;
} */

.report-tabular-card tr:last-child {
    border-bottom:1px solid #dfdfdf;
}

.report-tabular-card th {
    border-bottom:1px solid #dfdfdf;
    color: #74899f;
    font-weight: 500;
}

.report-tabular-card tr:nth-child(even) {
    background-color: #f7f7f8;
}

span.rp-tile-title {
    color:#2c4d70;
    font-weight: 550;
    padding-right: 5px;
}
.communication-type {
    color: rgb(134, 134, 134);
    font-size: 0.95em;
}

.her-final-step-section {
    padding: 0px 15px 15px 15px; 
    display: flex; 
    flex-direction: column;
}

.her-final-step-section .map-container {
    border: solid 1px #ddd;
    margin-top: 5px;
    margin-bottom: 5px;
}

.her-final-step-section .map-container .map {
    height: 400px; 
    width: 100%;
}

.final-step-section-block {
    display: inline-flex; 
    width: inherit; 
    justify-content: space-between;
}

.address-block {
    width: 75%;
    min-width: 700px;
}

.final-step-section-block-item {
    display: flex; 
    flex-direction: column;
}

.final-step-section-block-item .block-item {
    display: inline-flex;
}

.summary-image-metadata .block-item {
    display: inline-flex;
}

.final-step-section-block-item a {
    text-decoration: underline;
    font-size: 13px;
}

.block-item.files-metadata {
    padding: 5px 0px 5px 5px;
    font-size: 12px;
}

.final-step .summary-label {
    padding-right: 5px; 
    color: #777;
}

.final-step h5 {
    font-size: 14px;
    margin-bottom: 2px;
}

.final-step .summary-value {
    color: #2b547c;
}

.final-step .file-list .file-upload-card {
    border-bottom: 1px solid #D3E5F4;
    border-radius: 2px;
    padding: 7px 8px 5px 15px;
    background: #fff;
    color: #666;
    height: 30px;
}

.final-step .file-list {
    margin-top: 5px;
    border: 1px solid #ddd;
    overflow-y: scroll;
    width: 100%;
}

.final-step .file-list .file-upload-card:nth-child(odd) {
    background: #F5FAFE;
}

.attendee-table {
    max-width: 750px;
}

.attendee-table>tbody>tr:nth-of-type(odd) {
    background-color: #F5FAFE;
}

.attendee-table .attendee-name{
    width: 300px;
}

.attendee-table .attendee-type{
    width: 450px;
}

.reference-number-table {
    max-width: 750px;
}

.reference-number-table>tbody>tr:nth-of-type(odd) {
    background-color: #F5FAFE;
}

.reference-number-table th {
    width: 250px;
}

.final-step .summary-image {
    max-height: 240px;
    border: 1px solid #343434;
}

.summary-image-metadata {
    display: flex; 
    flex-direction: column; 
    padding: 5px 5px 10px 0px;
}

.summary-image-metadata .summary-value {
    max-width: 300px;
}

.final-step .summary-image-container {
    margin: 5px 5px 5px 0px;
    display: inline-block;
}

.consultation-map-step {
    width: 100%;
    height: 100%;
    padding: 0px;
}

/* Ensures search tags gracefully display any text overflowing */

.term-search-filter .select2-container--default .select2-selection--multiple .select2-selection__choice {
    max-width: 96%;
    text-overflow: ellipsis;
}

.term-search-filter .select2-container--default .select2-selection--multiple .select2-selection__choice button.search-tag {
    max-width: 98%;
    text-overflow: ellipsis;
    overflow: hidden;
}

/* STOPS top level side panels being obscured by search filter popups in search*/

.ep-notifs {
    z-index: 12000;
}

.ep-help {
    z-index: 12000;
}

.ep-edits {
    z-index: 12000;
}

/* Makes side panels cover the whole height of the page when the UI stacks in mobile mode */

.ep-help-panel{
    height: 100%;
}

.ep-edits-panel{
    height: 100%;
}

.ep-notifs-panel{
    height: 100%;
}

/* Ensures Consultation > Related Application Area > Create new application area ... - displays correctly */

.workbench-card-sidebar {
    z-index: 245;
}
