/*
TABLE OF CONTENTS: (SEARCH EXAMPLE: "--UTILITIES"
--UTILITIES
--COMPONENTS
--SECTION NAVBAR
--SECTION HERO
*/

@import url("https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Merriweather:wght@900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;900&family=Merriweather:wght@900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Sintony:wght@400;700&display=swap");

:root {
    --primary-color: rgba(145, 72, 83, 1);
    --primary-color__light: rgb(176, 102, 113);
    /* --secondary-color: rgba(251, 213, 192, 0.551); */
    --secondary-color: rgb(253, 232, 220);
    /* --secondary-color:  #FDE8DC; */

    --accent-color: rgba(135, 206, 235, 1);
    --black-color: rgba(32, 31, 31, 1);
    --grey-color: rgba(32, 31, 31, 0.675);
    --white-color: rgba(255, 255, 255, 1);
    --gradient-primary: linear-gradient(276.78deg, #a2505d 0%, #c89098 100%);
    --font-heading: "Poppins", "Inter", sans-serif;
    --font-body: "Lora", sans-serif;

    --letterSpacing-wide: 0.1rem;
}

* {
    /* font-family: var(--font-body) !important; */
    transition: all 0.2s ease-in-out;
}

s {
    font-family: inherit !important;
}

section {
    position: relative;
}

/* --UTILITIES */
.ms-n5 {
    margin-left: -40px;
}

.text-color--primary {
    color: var(--primary-color);
}
.text-color--secondary {
    color: var(--secondary-color);
}

.text--color-grey {
    color: var(--grey-color);
}

.text--color-white {
    color: var(--white-color);
}

.font-heading {
    font-family: var(--font-heading) !important;
}
.font-body {
    font-family: var(--font-body) !important;
}

.more-info {
    font-size: 1.15rem;
}

.bg-custom-primary {
    background: var(--primary-color);
}
.bg-custom-secondary {
    background: var(--secondary-color);
}
.bg-patterns {
    background: url(/partner-theme/rosegold/img/pattern/leaves.svg);
    background-size: cover;
    background-repeat: repeat;
    background-position: top;
    /* background-attachment: fixed; */
}
.bg-patterns-hero-about-us {
    background-image: url(/partner-theme/rosegold/img/pattern/leaves-whitebg.svg);
    background-position: right center;
    background-size: 58% 100%;
}

@media only screen and (max-width: 768px) {
    .bg-patterns-hero-about-us {
        background-position: bottom !important;
        background-size: 198% !important;
        filter: blur(1px) ;
    }
}

.circle-icon {
    /* background: #ffc0c0; */
    background: var(--primary-color__light);

    padding: 18px;
    border-radius: 50%;
}

body .cl-light {
    color: #eeeeee;
}

body .cl-light-grey-2 {
    color: #c89098;
}

body .font-lora {
    font-family: "Lora", sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--font-heading) !important;
}

.btn {
    letter-spacing: var(--letterSpacing-wide);
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.875rem;
    font-family: var(--font-heading) !important;
}

.btn-package {
    transition: all 0.3s ease-in-out !important;
    background: rgba(0, 0, 0, 0.5) !important;
    color: #fff !important;
    font-size: 0.875rem !important;
    letter-spacing: 0.025rem;
    border: 0;
}

.btn-package:hover,
.btn-package.active {
    background: var(--color_primary) !important;
    background: rgb(255, 255, 255, 0.5) !important;
    color: #111 !important;
    border: 0;
}

.btn-oval {
    border-radius: 50px !important;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: var(--white-color);
    background-color: var(--primary-color__light);
}

@media only screen and (max-width: 576px) {
    .btn-package {
        font-size: 60% !important;
        width: 44%;
    }
    .more-info {
        font-size: 1rem;
    }
}

/* --END UTILITIES */

/* --COMPONENTS */
.btn-primary {
    /* background: var(--gradient-primary); */
    background: var(--primary-color);

    border: 0;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #eeeeee;
}
.btn-primary.gradient {
    background: var(--gradient-primary);
}

.btn-primary:hover {
    background: var(--secondary-color) !important;
    color: var(--black-color) !important;
}

.btn-outline-primary {
  background: transparent;
  border: 2px solid var(--primary-color);
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  color: var(--primary-color);
  transition: background-color 0.2s ease, color 0.2s ease;
}

.btn-outline-primary:hover {
  background-color: var(--primary-color) !important;
  color: #eeeeee;
  border-color: var(--primary-color);
}

/* Gaya untuk btn-outline-primary saat active */
.btn-outline-primary:active {
  background-color: var(--primary-color) !important;
  color: #eeeeee;
  border-color: var(--primary-color);
}

/* Gaya untuk btn-outline-primary saat focus */
.btn-outline-primary:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(136, 76, 179, 0.5);
}

.btn-outline-primary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(136, 76, 179, 0.5);
}

/* Gaya untuk btn-outline-primary saat disabled */
.btn-outline-primary:disabled {
  background: transparent;
  color: #e0cfe8;
  border-color: #e0cfe8;
  cursor: not-allowed;
}

/* --END COMPONENTS */

/* --SECTION NAVBAR */
.navbar * {
    padding-left: 10px;
    padding-right: 10px;
    font-family: var(--font-heading) !important;
    letter-spacing: var(--letterSpacing-wide);
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.875rem !important;
}

.navbar a {
    color: var(--black-color);
}
.navbar a:hover {
    color: var(--primary-color) !important;
}

.navbar .btn-cta {
    background: var(--gradient-primary);
    border-radius: 8px !important;
    color: #eeeeee !important;
    padding: 8px 16px;
    margin-left: 16px;
}
.navbar .btn-cta:hover {
    background: var(--secondary-color) !important;
    color: var(--black-color) !important;
}

.navbar {
    transition: all 0.35s ease-in-out;
}

.navbar-scrolled {
    background: rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: saturate(180%) blur(5px);
    backdrop-filter: saturate(180%) blur(5px);

    backface-visibility: hidden;
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1);
}

.navbar-brand img {
    max-height: 2.25em;
    min-height: 1.75em;
}

.nav-link.primary {
    color: var(--primary-color);
}
@media only screen and (max-width: 991px) {
    .bg-navbar-transparent {
        background: rgba(255, 255, 255, 0.5);
        -webkit-backdrop-filter: saturate(180%) blur(5px);
        backdrop-filter: saturate(180%) blur(5px);

        backface-visibility: hidden;
        box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1);
    }
    .nav-item a {
        padding-left: 0;
    }
    .navbar .btn-cta {
        display: block;
        margin-left: 0;
        margin-top: 8px;
    }
}

/* --END SECTION NAVBAR */

/* --SECTION HERO */
body .main-hero__ {
    /* background: linear-gradient(94.41deg, #00FFD1 0%, #27D7D7 52.17%, #3FE8FF 100%); */
    background: linear-gradient(276.78deg, #a2505d 0%, #f6cfca 100%);
    background: url(/partner-theme/rosegold/img/rosegold_wall_1.jpg);
    box-shadow: inset 0 0 0 2000px rgba(255, 255, 255, 0.15);
    background-size: cover;
    opacity: 0.8;
    padding: 112px 0px 20px;
}

.main-hero2__ {
    min-height: 400px;
    padding-top: 184px;
    padding-bottom:64px;
}

@media only screen and (max-width: 768px) {
    .main-hero2__ {
        min-height: 764px;
    }
}

@media only screen and (min-width: 768px) {
    body .main-hero__ {
        padding-top: 128px;
        padding-bottom: 30px;
    }


}

.headline {
    color: var(--primary-color);
    font-weight: 700;
}

body .main-hero__ .headline {
    font-size: 32px;
    font-weight: 600;
}

body .main-hero__ .sub-headline {
    font-size: 20px;
    /* font-weight: 400; */
    /* color: #000909;
    color: #ffffff; */
    color: var(--primary-color);
}

.sub-headline2 {
    font-size: 20px;
}

.sub-headline2 b {
    color: var(--accent-color);
}

body .main-hero__ .subscribe {
    margin-top: 75px;
}

body .main-hero__ .form-subscribe {
    padding: 12px 12px 12px 24px;
    background: #ffffff;
    border-radius: 12px;
    height: 64px;
    width: 459px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

body .main-hero__ .input-search {
    font-size: 16px;
    font-weight: 600;
}

body .main-hero__ .btn-subscribe {
    /* background: linear-gradient(276.78deg, #016A6A 0%, #02A6A6 100%); */
    background: linear-gradient(276.78deg, #a2505d 0%, #c89098 100%);

    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 600;
    color: #eeeeee;
}

@media only screen and (max-width: 768px) {
    body .main-hero__ .btn-subscribe {
        font-size: 12px !important;
    }
}

.bg-holder {
    position: absolute;
    width: 100%;
    min-height: 100%;
    top: 0;
    left: 0;
    /* background-size: cover;
    background-position: center; */
    overflow: hidden;
    will-change: transform, opacity, filter;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-repeat: no-repeat;
    z-index: -1;
}

/* --END SECTION HERO */

/* --SECTION THEMEGALLERY */

.imgWrapper--themeGallery {
    position: relative;
}

.imgBadge--themeGallery {
    position: absolute;
    top: 4px;
    left: 4px;
    padding: 4px 8px;
    background: var(--gradient-primary);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    color: #eeeeee;
}

.text--titleThemeGallery {
    font-size: 14px;
    font-weight: 600;
    color: var(--black-color);
}
.text--subtitleThemeGallery {
    font-size: 12px;
    font-weight: 400;
    color: var(--grey-color);
}

.text--titleThemeGallery,
.text--subtitleThemeGallery {
    display: block;
}

.imgWrapper--themeGallery img {
    border-radius: 12px;
    width: 100%;
}

/* --END SECTION THEMEGALLERY */

/* NEW NEW NEW */

footer {
    position: relative;
    z-index: 2;
}
.list-unstyled {
    padding-left: 0;
    list-style: none;
}

a.theme-link {
    color: var(--grey-color);
}

a.footer-link {
    text-decoration: none;
}

a.footer-link:hover {
    text-decoration: underline;
}

.text-200 {
    color: #f2f2f2 !important;
}
.text-500 {
    color: #949494 !important;
}
.bg-1000 {
    /* background-color: #212240 !important; */
    background-color: var(--primary-color__light) !important;
}
.font-sans-serif {
    font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI",
        Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji",
        "Segoe UI Emoji", "Segoe UI Symbol";
}

.font-base {
    font-family: "Baloo Bhaijaan 2", Menlo, Monaco, Consolas, "Liberation Mono",
        "Courier New", monospace;
}
/* END NEW NEW NEW */

.patterns::before {
    background-color: #e5e5f7;
    opacity: 0.2;
    background-image: repeating-radial-gradient(
            circle at 0 0,
            transparent 0,
            #e5e5f7 10px
        ),
        repeating-linear-gradient(#444cf755, #444cf7);
}

/* Bottom Divider */
.custom-shape-divider-bottom-1690551055 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}

.custom-shape-divider-bottom-1690551055 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 48px;
}

.custom-shape-divider-bottom-1690551055 .shape-fill {
    fill: var(--white-color);
}
/* END Bottom Divider */

/* Up Divider */
.custom-shape-divider-top-1690551789 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}

.custom-shape-divider-top-1690551789 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 48px;
}

.custom-shape-divider-top-1690551789 .shape-fill {
    fill: #ffffff;
}
/* END Up Divider */

/* Vue 2 Pagination Override */
.page-item.active .page-link {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.page-link {
    color: var(--primary-color);
    /* border-color: var(--primary-color); */
}

.page-link:hover {
    color: var(--primary-color);
    background-color: #e9ecef;
}
.VuePagination {
    margin-top: 2rem;
    display: flex;
    justify-content: center;
}
.VuePagination__count {
    display: none;
}

@media (max-width: 576px) {
    .VuePagination * {
        font-size: 90%;
    }
    .VuePagination__pagination {
        flex-wrap: wrap;
        justify-content: center;
    }
}

/* END Vue 2 Pagination Override */



/* img card */
.img-container {
    height: 10em;
    margin-bottom: 1em;
    border-radius: 8px;
}

.img-container img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 8px;
}

/* end of img card */


/* Bundle Section */
.bundle-section {
  font-size: 90% !important;
}
.bundle-section .card-bundle{
  position: relative;
  background-color: #cfcfcf;
  border-radius: 20px;
  cursor: pointer;
  transition: all 300ms linear;
}
.bundle-section .card-bundle .bundle-img-container{
  display: flex;
  justify-content: center;
  flex-direction: column;
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
}
.bundle-section .card-bundle.active{
  background-color: #32AD79;
}
.bundle-section .card-bundle .bundle-img{
  display: flex;
  padding: 7px;
  margin: 0 auto;
  width: 75px;
  height: 75px;
}
.bundle-section .card-bundle .bundle-img-container p{
  color: #999999;
  font-weight: 700;
  line-height: 16px;
}
.bundle-section .card-bundle.active .bundle-img-container p{
  color: #1f2d3d;
}
.bundle-section .card-bundle .bundle-content h4{
  color: #dc3545;
}
.bundle-section .card-bundle.active .bundle-content h4{
  color: #EED66A;
}
.bundle-section .card-bundle .bundle-content .bundle-desc{
  color: #212529;
  line-height: 20px;
}
.bundle-section .card-bundle.active .bundle-content .bundle-desc{
  color: #FFFFFF;
}
.bundle-section .card-bundle .bundle-img .bundle-img-filterig{
  background-image: url('/admin-theme/dist/img/icon_bundling/icon_none_filterig.png');
  background-size: 90%;
  background-position: center;
  background-repeat: no-repeat;
  width: 75px;
  transition: all 300ms linear;
}
.bundle-section .card-bundle.active .bundle-img .bundle-img-filterig{
  background-image: url('/admin-theme/dist/img/icon_bundling/icon_filterig.png');
}
/* ============================= */
.bundle-section .card-bundle .bundle-img .bundle-img-videogold{
  background-image: url('/admin-theme/dist/img/icon_bundling/icon_none_vid.png');
  background-size: 90%;
  background-position: center;
  background-repeat: no-repeat;
  width: 75px;
  transition: all 300ms linear;
}
.bundle-section .card-bundle.active .bundle-img .bundle-img-videogold{
  background-image: url('/admin-theme/dist/img/icon_bundling/icon_gold_vid.png');
}
/* ============================== */
.bundle-section .card-bundle .bundle-img .bundle-img-videoplatinum{
  background-image: url('/admin-theme/dist/img/icon_bundling/icon_none_vid.png');
  background-size: 90%;
  background-position: center;
  background-repeat: no-repeat;
  width: 75px;
  transition: all 300ms linear;
}
.bundle-section .card-bundle.active .bundle-img .bundle-img-videoplatinum{
  background-image: url('/admin-theme/dist/img/icon_bundling/icon_platinum_vid.png');
}
/* ================================ */
.bundle-section .bundle-price{
  padding: 4px 7px;
  background-color: white;
  border-radius: 20px;
}
.bundle-section .bundle-price s{
  color: red;
}
@media only screen and (min-width: 991px) {
  .bundle-section {
    max-width: 800px;
    margin: 0 auto;
  }
}
/* End of bundle section */

