@import "fonts.css";
@import "primeicons/primeicons.css";

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
    .container {
        @apply max-w-5xl xl:max-w-[1200px] 2xl:max-w-[1460px] mx-auto px-4 lg:px-8 xl:px-0;
    }

    .smaller-container {
        @apply max-w-[1000px] xl:max-w-6xl 2xl:max-w-[1218px] mx-auto px-4 lg:px-[75px] 2xl:px-0;
    }

    .section-gap {
        @apply py-7 lg:py-20;
    }

    .section-gap-down {
        @apply pb-7 lg:pb-12;
    }

    .fixed-navbar-space {
        @apply pt-[65px] lg:pt-[80px];
    }

    .custom-caption {
        @apply [&_figure]:relative [&_figure]:pb-8 [&_figcaption]:absolute [&_figcaption]:bottom-0 [&_figcaption]:text-base [&_figcaption]:text-custom-black [&_figcaption]:w-full [&_figcaption]:text-center [&_img]:mx-auto [&_img]:!my-0 [&_figcaption>span]:hidden;
    }

    .custom-primary-button {
        @apply bg-primary-color text-base-color group-hover/button:text-grey-medium hover:text-grey-medium duration-500 transition-all;
    }

    .banner-title-font-size {
        @apply text-sm md:text-base lg:text-2xl xl:text-2xl 2xl:text-4xl;
    }

    .banner-content-font-size {
        @apply text-xxs xs:text-xs md:text-base lg:text-lg 2xl:text-2xl;
    }
}

:root {
    --p-accordion-panel-border-color: #ffffff !important;
    --p-accordion-header-border-color: #6d5757 !important;
    --p-accordion-content-border-color: #ffffff !important;
    --p-icon-size: 14px !important;
    --p-mask-background: rgba(0, 0, 0, 0.4) !important;
    --p-select-option-selected-color: #72003b !important;
    --p-select-option-selected-focus-color: #72003b !important;
    --p-select-option-selected-background: #fff0f1 !important;
    --p-select-option-selected-focus-background: #fff0f1 !important;
    --p-form-field-focus-border-color: #72003b !important;
    --p-select-border-radius: 16px !important;
    --p-checkbox-checked-border-color: #72003b !important;
    --p-checkbox-checked-background: #72003b !important;
    --p-checkbox-checked-hover-border-color: #72003b !important;
    --p-checkbox-checked-hover-background: #72003b !important;
    --p-message-error-simple-color: #72003b !important;
    --p-progressspinner-color-one: #72003b !important;
    --p-progressspinner-color-two: #72003b !important;
    --p-progressspinner-color-three: #72003b !important;
    --p-progressspinner-color-four: #72003b !important;
    --p-paginator-nav-button-color: #72003b !important;
    --p-paginator-nav-button-background: #fff !important;
    --p-paginator-nav-button-selected-color: #fff !important;
    --p-paginator-nav-button-selected-background: #72003b !important;
    --p-paginator-nav-button-border-radius: 12px !important;
    --p-paginator-gap: 20px !important;
    --p-paginator-background: transparent !important;
}

@media screen and (max-width: 1024px) {
    :root {
        --p-paginator-nav-button-width: 32px !important;
        --p-paginator-nav-button-height: 32px !important;
    }
}

.p-select {
    height: 56px;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.p-select-dropdown-icon {
    color: #72003b !important;
}

@media screen and (max-width: 1024px) {
    .p-select {
        height: 40px;
    }
}

.p-select-label.p-placeholder {
    color: #8d9091 !important;
}

.p-dialog {
    border-radius: 0 !important;
    border-top-right-radius: 36px !important;
    border-bottom-left-radius: 36px !important;
    box-shadow: none !important;
}

.p-dialog-header-actions {
    z-index: 30 !important;
}

.p-dialog-header-actions .p-button-icon-only {
    width: 25px !important;
    height: 25px !important;
}

.p-dialog-header {
    padding-top: 20px !important;
    padding-inline: 20px !important;
    padding-bottom: 0 !important;
}

.p-dialog-content {
    padding: 0;
    padding-inline: 20px;
    padding-bottom: 20px;
}

.p-dialog-close-button {
    outline: none !important;
}

.p-timeline-event-opposite {
    display: none !important;
}

.p-paginator .p-icon {
    width: 28px !important;
    height: 28px !important;
    color: #8d9091 !important;
}

.p-paginator-last {
    display: none !important;
}

.p-paginator-first {
    display: none !important;
}

.p-paginator-next,
.p-paginator-prev {
    background: transparent !important;
}

.attachment__caption,
.attachment__caption--edited {
    position: static !important;
    display: block;
    width: 100%;
    margin-top: 0.5rem;
    padding: 0.25rem 0.75rem 0;
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.4;
    color: #6b7280;
    background: transparent;
}

figure.attachment {
    margin-bottom: 0;
}