/*
    CARD komponenta
*/

:root {
    --nb-card-floating-body-bg: var(--nb-color-white);
    --nb-card-floating-body-height: 130px;
    --nb-card-floating-transition: all 0.5s ease;
}

.nb-card {
    border: var(--nb-card-border-width) var(--nb-border-style) var(--nb-border-color);
    border-radius: var(--nb-card-border-radius);
    background: var(--nb-card-bg);
}

.nb-card.border-radius-bottom{
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
}

.nb-card.border-radius-top{
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.nb-card .nb-card-footer{
    border-bottom-left-radius: var(--nb-card-border-radius);
    border-bottom-right-radius: var(--nb-card-border-radius);
    background-color: var(--nb-card-footer-bg);
    padding: var(--nb-card-spacer-y) var(--nb-card-spacer-x);
    border-top: var(--nb-card-footer-top-border-width) var(--nb-border-style) var(--nb-card-footer-top-border-color);
}

.nb-card .nb-card-header {
    border-top-left-radius: var(--nb-card-border-radius);
    border-top-right-radius: var(--nb-card-border-radius);
    background-color: var(--nb-card-header-bg);
    padding: var(--nb-card-spacer-y) var(--nb-card-spacer-x);
    border-bottom: var(--nb-card-header-bottom-border-width) var(--nb-border-style) var(--nb-card-header-bottom-border-color);
}

.nb-card > .nb-img-wrapper{
    border-top-left-radius: var(--nb-card-border-radius);
    border-top-right-radius: var(--nb-card-border-radius);
    overflow: hidden;
}

.nb-card.nb-card-floating-body {
    position: relative;
    height: 100%;
    padding-bottom: var(--nb-card-floating-body-height);
}

.nb-card.nb-card-floating-body .nb-img-wrapper {
    height: 100%;
}

.nb-card.nb-card-floating-body .nb-card-body {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--nb-card-floating-body-bg);
    max-height: var(--nb-card-floating-body-height);
    overflow: hidden;
    transition: var(--nb-card-floating-transition);
    z-index: 2;
}

.nb-card.nb-card-floating-body:hover .nb-card-body {
    max-height: 100%;
}