/*
	New styling since IPT v2.5.0 (Bootstrap 5).
	If you consider the CSS and HTML could be improved for convenience
	of theming, please report an enhancement request in the IPT project
	site at https://github.com/gbif
	Thank you very much!
*/

/* Principle settings for all pages */

body {
    font-family: 'Lato',Helvetica,Arial,sans-serif !important;
    padding-top: 3.5rem; /* Separates nav and main */
    color: #4e565f;
    background: url('../images/bg.png') top left;
}

table {
    color: #4e565f !important;
}


/* Logo, header, menu etc. START */
.logo-ceiba {
    height: 55px;
    position: relative;
    line-height: 32px;
    vertical-align: middle;
}

header, .dropdown-menu {
    font-size: 0.875rem !important;
}

.dropdown-item:active {
    background-color: #ef5d32 !important;
}

.bg-gbif-main-navbar {
    background: #ebe5de;
    border-top: 2px solid #d9d9d9;
    border-bottom: 2px solid #d9d9d9;
    padding: 0 15px 10px;
    margin: 1px 0 20px;
}

.logo-iavh {
    height: 45px;
}

.navbar-button {
    color: #ffffff !important;
    background: #ef5d32;
}

.navbar-button:hover {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.gbif-translate-icon, .gbif-heartbeat-icon {
    fill: white;
}
/* Logo, header, menu etc. END */


/* Admin page styles START */
.admin-col-listing .admin-col-listing-item {
    position: relative;
    display: block;
    height: 100%;
    padding: 4rem;
    color: #4e565f;
    transition: all .2s ease-in-out;
    text-decoration: none;
}

@media (max-width: 1200px) {
    .admin-col-listing .admin-col-listing-item {
        padding: 2rem;
    }
}

.admin-icon-wrapper {
    transition: transform .5s;
    transition-timing-function: ease-out;
}

.admin-icon-wrapper:hover {
    transform: scale(1.75);
}

.admin-col-listing .admin-col-listing-item .admin-icon {
    color: #ef5d32;
}

.admin-icon {
    font-size: 36px;
}

.admin-col-listing .admin-col-listing-item .admin-card-title {
    margin-top: .5rem;
}

.admin-card {
    display: block;
    padding: 1px 0;
    background-color: #fff;
    border: none;
}

.admin-card .admin-card-title:last-child {
    margin-bottom: 0;
}

.admin-card .card-body {
    padding: 0 1.5rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.admin-card-title {
    font-size: 1rem;
}
/* Admin page styles END */


/* Footer START */
footer a {
    text-decoration: none !important;
}

.ipt-footer-item:after {
    content: '|';
    margin: 0 5px;
}

.footer-gbif-logo {
    width: 55px;
}
/* Footer END */


/* Links color with exception for some classes START */
a:not(.btn, .button, .navbar-brand, .nav-link, .menu-link, .popover-link, .admin-col-listing-item, .doi) {
    color: #4BA2CE !important;
    text-decoration: none !important;
}

a:not(.btn, .button, .navbar-brand, .nav-link, .menu-link, .popover-link, .admin-col-listing-item, .doi):focus,
a:not(.btn, .button, .navbar-brand, .nav-link, .menu-link, .popover-link, .admin-col-listing-item, .doi):hover {
    color: #2c79a1 !important;
    text-decoration: underline !important;
}

a.leaflet-control-zoom-in:focus, a.leaflet-control-zoom-in:hover,
a.leaflet-control-zoom-out:focus, a.leaflet-control-zoom-out:hover,
a.no-text-decoration, a.no-text-decoration:focus, a.no-text-decoration:hover {
    text-decoration: none !important;
}
/* Links color with exception for some classes END */


/* Datepicker styles START */
.datepicker table tr td span.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active:hover {
    background-image: linear-gradient(to bottom, #ef5d32, #ef5d32) !important;
}

.datepicker table tr td.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active:hover {
    background-image: linear-gradient(to bottom, #ef5d32, #ef5d32) !important;
}

.datepicker td, .datepicker th {
    font-size: 1rem !important;
}

.datepicker-days td, .datepicker-days th {
    width: 40px !important;
}
/* Datepicker styles END */


/* Custom colors */
.text-gbif-primary {
    color: #ef5d32;
}

.text-gbif-danger {
    color: #e36370;
}

.text-gbif-header {
    color: #f29131;
}

.text-gbif-header-2 {
    color: #376c88;
}

.bg-gbif-primary {
  background-color: #ef5d32;
}

.bg-gbif-danger {
  background-color: #e36370;
}

.bg-gbif-header {
  background-color: #4E565F;
}

/* Custom alerts colors START */
.alert-success {
    color: #1e4620;
    background-color: #edf7ed;
    border-color: #edf7ed;
}

.alert-warning {
    color: #663c00;
    background-color: #fff4e5;
    border-color: #fff4e5;
}

.alert-danger {
    color: #5f2120;
    background-color: #fdeded;
    border-color: #fdeded;
}
/* Custom alerts colors END */


/* GBIF gray colored outline button START */
.btn-outline-secondary {
    color: #4e565f !important;
    border-color: #bec6ce !important;
}
.btn-outline-secondary:hover, .btn-outline-secondary:active {
    color: #212529 !important;
    background-color: #eaecef !important;
    border-color: #bec6ce !important;
}
.btn-outline-secondary:focus, .btn-outline-secondary:active:focus {
    box-shadow: 0 0 0 0.25rem rgba(190, 198, 206, 0.25) !important;
}
/* GBIF gray colored outline button START */


/* GBIF green colored outline button START */
.btn-outline-gbif-primary {
    color: #ef5d32;
    border-color: rgba(239, 141, 112, 0.5);
}
.btn-outline-gbif-primary:hover {
    color: #ef5d32;
    background-color: rgba(97, 168, 97, 0.04);
    border-color: #ef5d32;
}
.btn-check:focus + .btn-outline-gbif-primary, .btn-outline-gbif-primary:focus {
    box-shadow: 0 0 0 0.25rem rgba(113, 177, 113, 0.25) !important;
}
.btn-check:checked + .btn-outline-gbif-primary, .btn-check:active + .btn-outline-gbif-primary, .btn-outline-gbif-primary:active, .btn-outline-gbif-primary.active, .btn-outline-gbif-primary.dropdown-toggle.show {
    color: #fff !important;
    background-color: #ef5d32 !important;
    border-color: #ef5d32 !important;
}
.btn-check:checked + .btn-outline-gbif-primary:focus, .btn-check:active + .btn-outline-gbif-primary:focus, .btn-outline-gbif-primary:active:focus, .btn-outline-gbif-primary.active:focus, .btn-outline-gbif-primary.dropdown-toggle.show:focus {
    box-shadow: 0 0 0 0.25rem rgba(113, 177, 113, 0.25) !important;
}
.btn-outline-gbif-primary:disabled, .btn-outline-gbif-primary.disabled {
    color: #ef5d32 !important;
    background-color: transparent !important;
}
/* GBIF green colored outline button END */


/* GBIF red colored outline button START */
.btn-outline-gbif-danger {
    color: #e36370;
    border-color: rgba(227, 99, 112, 0.5);
}
.btn-outline-gbif-danger:hover {
    color: #e36370;
    background-color: rgba(227, 99, 112, 0.04);
    border-color: #e36370;
}
.btn-check:focus + .btn-outline-gbif-danger, .btn-outline-gbif-danger:focus {
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
}
.btn-check:checked + .btn-outline-gbif-danger, .btn-check:active + .btn-outline-gbif-danger, .btn-outline-gbif-danger:active, .btn-outline-gbif-danger.active, .btn-outline-gbif-danger.dropdown-toggle.show {
    color: #fff;
    background-color: #e36370;
    border-color: #e36370;
}
.btn-check:checked + .btn-outline-gbif-danger:focus, .btn-check:active + .btn-outline-gbif-danger:focus, .btn-outline-gbif-danger:active:focus, .btn-outline-gbif-danger.active:focus, .btn-outline-gbif-danger.dropdown-toggle.show:focus {
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
}
.btn-outline-gbif-danger:disabled, .btn-outline-gbif-danger.disabled {
    color: #e36370;
    background-color: transparent;
}
/* GBIF red colored outline button END */


/* Style form elements START */
.form-control, .form-select, .form-control:focus, .form-select:focus {
    color: #212529;
}

.form-select:hover {
    border-color: rgba(33, 37, 41, 0.5);
}

.form-control:hover {
    border-color: rgba(33, 37, 41, 0.5);
}

.form-control:focus {
    background-color: #fff;
    border-color: #ef896b;
    outline: 0;
    box-shadow: none;
}

.form-select:focus {
    border-color: #ef896b;
    outline: 0;
    box-shadow: none;
}

.form-check-input:not(.is-invalid):focus {
    border-color: #ef896b;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(113, 177, 113, 0.25);
}

.form-check-input:not(.is-invalid):checked {
    background-color: #ef5d32;
    border-color: #ef5d32;
}
/* Style form elements END */


/* Published versions table separator */
td.separator {
    border-right: 1px solid #EEEEEE;
    padding-right: 30px !important;
}

td.left_padding {
    padding-left: 30px !important;
}


/* Custom colors for tables pagination items START */
.page-link {
    position: relative;
    display: block;
    color: #ef5d32 !important;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #dee2e6;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.page-link:hover {
    z-index: 2;
    color: #ef5d32 !important;
    background-color: #e9ecef;
    border-color: #dee2e6;
}
.page-link:focus {
    z-index: 3;
    color: #ef5d32 !important;
    background-color: #e9ecef;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(113, 177, 113, 0.25) !important;
}

.page-item:not(:first-child) .page-link {
    margin-left: -1px;
}
.page-item.active .page-link {
    z-index: 3;
    color: #fff !important;
    background-color: #ef5d32 !important;
    border-color: #ef5d32 !important;
}
.page-item.disabled .page-link {
    color: #6c757d !important;
    pointer-events: none;
    background-color: #fff;
    border-color: #dee2e6;
}
/* Custom colors for tables pagination items END */


/* Overlay div for modal views START */
#modalbox {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
}

#modalback {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    filter: alpha(opacity=80);
    opacity: 0.8;
    -moz-opacity: 0.8;
}

#modalcontainer {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 80px;
    min-height: 50px;
}

#modalcontent {
    display: inline-block;
    margin: 0 auto;
    min-width: 100px;
    background-color: #fff;
    border: 1px solid #000;
    padding: 15px;
}
/* Overlay div for modal views END */


/* Style select2 component START */
.select2-container--bootstrap4 .select2-results__option--highlighted, .select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected="true"] {
    color: #fff !important;
    background-color: #ef5d32 !important;
}

.select2-container--bootstrap4.select2-container--focus .select2-selection {
    border-color: #ef896b !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(113, 177, 113, 0.25) !important;
    box-shadow: 0 0 0 0.25rem rgba(113, 177, 113, 0.25) !important;
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
    color: #212529 !important;
}
/* Style select2 component END */


/* Style autocomplete component START */
.ui-autocomplete {
    position: absolute;
    z-index: 1000;
    cursor: default;
    padding: 0;
    margin-top: 2px;
    list-style: none;
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.ui-autocomplete > li {
    padding: 3px 20px;
}

.ui-autocomplete > li.ui-state-focus {
    background-color: #DDD;
}

.ui-helper-hidden-accessible {
    display: none;
}

.ui-menu-item:hover {
    background-color: #ef5d32;
    color: #fff;
    cursor: pointer;
}

.ui-autocomplete-input {
    min-width: 200px;
}
/* Style autocomplete component END */


#watermark {
    position: fixed;
    opacity: 0.5;
    z-index: 1000;
    left: 50%;
    transform: translate(-50%, 0);
    color: #ef5d32;
}


/* Resource logo styling */
.icon {
    background-repeat: no-repeat;
    background-position: 0 50%;
    background-position-x: 10px;
    background-position-y: 50%;
    padding-left: 30px;
}


.icon-gbif {
    background-image: url('../images/gbif-logo.svg');
}


/* Licence logos styling START */
.cc_logo {
    display: block;
    float: left;
    margin-right: 18px;
    height: 31px;
    width: 88px;
}

.cc_by {
    background: url('../images/icons/cc-by.svg');
}

.cc_by_nc {
    background: url('../images/icons/cc-by-nc.svg');
    display: block;
    float: left;
    margin-right: 18px;
    height: 32px;
    width: 88px;
}

.cc_zero {
    background: url('../images/icons/cc-zero.svg');
}

.i2d_logo {
    background: url('../images/icons/i2d.png');
    display: block;
    float: left;
    margin-right: 18px;
    height: 40px;
    width: 67px;
}

.home-title {
    background-color: #ef5d32;
    color:#fff;
    font-weight: 700;
}

/* Licence logos styling END */


/* Version table pointer styling */
img.latestVersionHidden {
    opacity: 0.2;
}


/* Data records chars styling START */
ul.no_bullets li {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    padding-left: 0;
    margin-left: 0;
}

ul.horizontal_graph {
    margin: 0;
}

ul.horizontal_graph .grey_bar {
    background-color: #a9e4ba;
    border-radius: 1px;
    display: inline-block;
    height: 3px;
    margin: 0 0 2px;
}

ul.horizontal_graph li span {
    display: inline-block;
    width: 200px;
    font-size: 0.9em;
    word-wrap: break-word;
}

ul.no_bullets {
    list-style: outside none none;
}

ul.horizontal_graph .value_label {
    color: #cccccc;
    display: inline-block;
    font-size: 0.9em;
    margin: 0 0 0 10px;
    padding: 0;
}
/* Data records chars styling END */


/* Metadata map size */
#locationMap {
    clear: both;
    height: 170px;
    max-width: 310px;
}

#map {
    height: 320px;
    border: none;
    margin-top: 18px;
}


/* Metadata image size */
#resourcelogo img {
    max-width: 150px;
}


/* Resource mini logo in the table */
.resourceminilogo {
    width: 30px;
}


/* Pointer at info\warning icons */
i {
    cursor: pointer;
}

.icon-validate {
    padding: 0 !important;
}

/* No decoration for popovers */
a.popover-link, a.popover-link:hover, a.popover-link:focus {
    text-decoration: none !important;
}


/* Resource deletion buttons */
.confirmDeletion {
    border: none;
    color: #212529;
}


/* Alerts close buttons */
.btn-close:focus {
    box-shadow: none;
}


/* Utilities */
.overflow-x-auto {
    overflow-x: auto !important;
}

.overflow-x-hidden {
    overflow-x: hidden !important;
}

/* Deprecated, replace with fs-smaller */
.text-smaller {
    font-size: 0.875rem !important;
}

.fs-smaller {
    font-size: 0.875rem !important;
}

.fs-smaller-2 {
    font-size: 0.75rem !important;
}

.fw-400 {
    font-weight: 800;
}

/* Modal windows START */
.modal-confirm .modal-content {
    padding: 20px;
    border-radius: 5px;
    border: none;
    text-align: center;
    font-size: 16px;
}

.modal-confirm h5 {
    text-align: center;
    font-size: 20px;
    margin: 30px 0 -10px;
}

.modal-confirm .btn {
    min-width: 120px;
}

.modal-confirm .icon-box {
    width: 80px;
    height: 80px;
    margin: 0 auto;
    border-radius: 50%;
    z-index: 9;
    text-align: center;
    border: 3px solid #e36370;
}

.modal-confirm .icon-box i {
    color: #e36370;
    font-size: 46px;
    display: inline-block;
    margin-top: 13px;
}

.confirm-danger-icon {
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    cursor: auto;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.modal-confirm .modal-header {
    border-bottom: none;
    position: relative;
}

.modal-confirm .modal-footer {
    border: none;
    text-align: center;
    border-radius: 5px;
    font-size: 13px;
    padding: 10px 15px 25px;
}

.modal-confirm .close {
    position: absolute;
    top: -5px;
    right: -2px;
}

.modal-header .close {
    padding: 1rem 1rem;
    margin: -1rem -1rem -1rem auto;
}

.my-3 {
    margin-top: 1.3rem !important;
    margin-bottom: 1rem !important;
}

button.close {
    padding: 0;
    background-color: transparent;
    border: 0;
}

.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}

.close:hover {
    color: #000;
    text-decoration: none;
}

.close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover {
    opacity: .75;
}
/* Modal windows END */


/* Anchors START */
.anchor {
    display: block;
    visibility: hidden;
}

.anchor-base {
    height: 45px;
    margin-top: -59px;
}

.anchor-resource-page {
    height: 45px;
    margin-top: -59px;
}

.anchor-mapping-page {
    height: 96px;
    margin-top: -110px;
}
/* Anchors END */


/* Sidebars and related (resource view, mapping, metadata) START */
@media (max-width: 768px) {
    .bd-main {
        grid-template-areas:
                "toc content";
        grid-template-columns: 1fr 4fr;
        grid-template-rows: 1fr auto;
    }
}

@media (min-width: 768px) {
    .bd-toc {
        position: -webkit-sticky;
        position: sticky;
        top: 5rem;
        right: 0;
        z-index: 2;
        height: calc(100vh - 7rem);
        overflow-y: auto;
    }
}

@media (max-width: 768px) {
    .bd-toc {
        display: none;
    }
}

@media (min-width: 768px) {
    .bd-layout {
        display: grid;
        gap: 1.5rem;
        grid-template-areas: "main";
    }

    .bd-main {
        display: grid;
        gap: inherit;
        grid-template-areas:
                    "toc content";
        grid-template-rows: auto auto 1fr;
    }

    .bd-main-right {
        grid-template-areas:
                    "content toc";
        grid-template-columns: 1fr auto;
    }


    #metadata-selector-container {
        display: none;
    }
}

.bd-main {
    grid-area: main;
}

.bd-toc {
    grid-area: toc;
}

.bd-content {
    grid-area: content;
    min-width: 1px;
}

.bd-toc nav ul {
    padding-left: 0;
    list-style: none;
}

.bd-toc nav a.sidebar-link, .bd-toc nav a.sidebar-navigation-link {
    font-size: 0.875rem;
    color: #4e565f !important;
    text-decoration: none !important;
    padding: 10px;
    margin-left: -10px;
    display: block;
    line-height: 1rem;
    cursor: pointer;
}

.bd-toc nav a.sidebar-navigation-link {
    border-left: 2px solid #e2e7ea;
}

.bd-toc nav a:hover {
    text-decoration: none !important;
    color: #4e565f !important;
}

.bd-toc nav a.active {
    border-left: 2px solid #09c;
}

#additional {
    height: 100vh;
    min-height: 200px;
}

.anchor-home-resource-page {
    height: 45px;
    margin-top: -59px;
}

.logoImg>img {
    max-height: 64px;
}

dt, dd {
    display: inline;
}
/* Sidebars and related (resource view, mapping, metadata) END */


/* DOI link START */
.doi {
    text-decoration: none;
    display: inline-block;
}

.doi, .smaller {
    font-size: 12px;
}

.doi span:first-of-type {
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    background: #09c;
    padding: 0 4px;
    border-radius: 5px 0 0 5px;
    color: #fff;
    border-right-width: 0;
    border-color: #09c;
}

.doi span {
    border: 1px solid #dbe3e7;
}

.doi span:last-of-type {
    background: #fff;
    padding: 0 7px;
    border-radius: 0 5px 5px 0;
    border-left-width: 0;
}
.doi span:last-of-type, a.doi:hover {
    color: #333;
    text-decoration: none !important;
}

a.doi:hover span:first-of-type {
    background: #004d66;
    border-color: #004d66;
}
/* DOI link END */

/* GBIF icons (see portal16) START */
@font-face {
    font-family: 'gbificons';
    src:url('./fonts/gbificons.eot?v=1594215369');
    src:url('./fonts/gbificons.eot?v=1594215369#iefix') format('embedded-opentype'),
    url('./fonts/gbificons.ttf?v=1594215369') format('truetype'),
    url('./fonts/gbificons.woff?v=1594215369') format('woff');
    font-weight: normal;
    font-style: normal;
}

.gb-icon:before {
    font-family: 'gbificons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.gb-icon-quote:before {
    content: "\EA41";
}
/* GBIF icons END */


/* Citation border */
#intellectualRightsDiv, .howtocite {
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}