﻿:root,
:host {
    --spacing: 0.25rem;
    --editor-hover-a: #0c09a1;
    --editor-a: #0d6efd;
    --editor-h2-color: #100855;
    --editor-h2-size: 1rem;
    --editor-h3-size: 1rem;
    --editor-p-size: .875rem;
    --editor-p-color: #343434;
    --editor-blockquote-border-color: #522440;
    --editor-blockquote-bg: #fef3fd;
    --editor-blockquote-hover-bg: #fff3e0;
    --editor-blockquote-a-color: #c0392b;
    --form-alert-star: #ff0000;
    --form-submit-button: #0fa357;
    --form-file-bg: #1c3faa;
    --pagination-active-bg: #121212;
    --faq-body-bg: #ffffff;
    --faq-header-title-size: 1.25rem;
    --faq-header-title-leading: 1.4;
    --faq-answer-title-size: .875rem;
    --pagination-active-color: #ffffff;
    --pagination-hover-bg: #121212;
    --pagination-hover-color: #ffffff;
    --faq-border-design-header: #121212;
    --faq-answer-title-color: #484d57;
    --color-white: #ffffff;
}


/* Reset for buttons, inputs, selects, textarea, file selector button inside .hform and .editor */
.hform button,
.hform input,
.hform select,
.hform optgroup,
.hform textarea,
.hform ::file-selector-button,
.editor button,
.editor input,
.editor select,
.editor optgroup,
.editor textarea,
.editor ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
}

/* Universal box-sizing and margin/padding/border reset for elements inside .hform and .editor */
.hform *,
.hform ::after,
.hform ::before,
.hform ::backdrop,
.hform ::file-selector-button,
.editor *,
.editor ::after,
.editor ::before,
.editor ::backdrop,
.editor ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
}

/* Remove list styles */
.hform ol,
.hform ul,
.hform menu,
.editor ol,
.editor ul,
.editor menu {
    list-style: none;
}

/* Media elements display */
.hform img,
.hform svg,
.hform video,
.hform canvas,
.hform audio,
.hform iframe,
.hform embed,
.hform object,
.editor img,
.editor svg,
.editor video,
.editor canvas,
.editor audio,
.editor iframe,
.editor embed,
.editor object {
    display: block;
    vertical-align: middle;
}

/* Responsive media sizing */
.hform img,
.hform video,
.editor img,
.editor video {
    max-width: 100%;
    height: auto;
}


.hform input[type="checkbox"],
.hform input[type="radio"] {
    cursor: pointer;
}

/* .hform styles */


.hform .hfile\:hcursor-pointer {
    &::file-selector-button

{
    cursor: pointer;
}

}

.hform .hfile\:hborder-none {
    &::file-selector-button

{
    --tw-border-style: none;
    border-style: none;
}

}

.hfile\:hbg-themeInformation {
    &::file-selector-button

{
    background-color: var(--form-file-bg);
}

}

.hfile\:hpx-4 {
    &::file-selector-button

{
    padding-inline: calc(var(--spacing) * 4);
}

}

.hfile\:hpy-2 {
    &::file-selector-button

{
    padding-block: calc(var(--spacing) * 2);
}

}

.hfile\:htext-base {
    &::file-selector-button

{
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
}

}

.hfile\:htext-white {
    &::file-selector-button

{
    color: var(--color-white);
}

}


.hform .red-star {
    color: var(--form-alert-star);
}

.hform .hp-2 {
    padding: calc(var(--spacing) * 2);
}

.hform .hgrid {
    display: grid;
}

.hform .hgrid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.hform .hgap-x-3 {
    column-gap: calc(var(--spacing) * 3);
}

.hform .hgap-y-5 {
    row-gap: calc(var(--spacing) * 5);
}

/* Input styles */
.hform .hinput {
    padding: 0.5rem;
    border-radius: 0.25rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    overflow: hidden;
    width: 100%;
    background-color: #eeeeee;
}

    .hform .hinput:focus {
        outline: none;
        background-color: #ffffff;
        box-shadow: 0 0 0 2px rgba(1, 104, 27, 0.3);
    }

/* Button styles */
.hform .button {
    padding: 0.5rem 0.75rem;
    border-radius: 0.25rem;
    font-weight: 500;
    cursor: pointer;
    background: var(--form-submit-button);
    position: relative;
    color: white;
    min-width: 7rem;
}

/* Direction LTR */
.hform .direction-ltr {
    direction: ltr;
}

/* Margin utility */
.hform .hm-2 {
    margin: calc(var(--spacing) * 2);
}


/* Media queries for .md:hgrid-cols-3 and col-span inside .hform */
@media (width < 48rem /* 768px */ ) {
    .editor table {
        text-wrap: nowrap;
        display: block;
        overflow-x: auto;
    }

        .editor table thead,
        .editor table tbody {
            display: inline-table;
            width: 100%;
        }
}


@media (width >= 48rem /* 768px */ ) {
    .hform .md\:hgrid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .hform .md\:hcol-span-1 {
        grid-column: span 1 / span 1;
    }

    .hform .md\:hcol-span-2 {
        grid-column: span 2 / span 2;
    }

    .hform .md\:hcol-span-3 {
        grid-column: span 3 / span 3;
    }
}

@media screen and (min-width: 640px) {
    .editor ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* Editor ul styles */

.editor ul {
    display: grid;
    list-style-position: inside;
    padding: 0.75rem;
    background-color: rgb(243 244 246);
    border-radius: 0.375rem;
    border: 1px solid #e5e7eb;
    list-style-type: disc;
    gap: 0.75rem;
}

.editor > ul li {
    padding: 0.2rem;
}

    .editor > ul li *:first-child {
        display: inline;
    }

    .editor > ul li a:hover {
        color: var(--editor-hover-a);
    }

/* Table styles */


.editor table {
    width: 100% !important;
    border: 1px solid #cad5e2;
}

    .editor table tr {
        border-bottom: 1px solid #cad5e2;
    }

    .editor table td,
    .editor table th {
        padding: 0.5rem;
    }

    /* Table first row backgrounds */
    .editor table:has(> tbody:first-child) > tbody:first-child > tr:first-child {
        background-color: #f3f4f6;
        text-wrap: nowrap;
    }

    .editor table:has(> thead:first-child) > thead:first-child > tr:first-child {
        background-color: #f3f4f6;
        text-wrap: nowrap;
    }
/* Editor text styles */
.editor a {
    color: var(--editor-a-color);
    display: inline-block;
}

.editor strong {
    color: inherit;
}

.editor h2 {
    color: var(--editor-h2-color);
    font-size: var(--editor-h2-size);
}

.editor h3 {
    color: var(--editor-h3-color);
    font-size: var(--editor-h3-size);
}

.editor p {
    color: var(--editor-p-color);
    text-align: justify;
    font-size: var(--editor-p-size);
    line-height: 1.5rem;
}

/* Editor spacing for child elements */
.editor * {
    : where(& > :not(:last-child))

{
    --tw-space-y-reverse: 0;
    margin-block-start: calc( calc(var(--spacing) * 3) * var(--tw-space-y-reverse) );
    margin-block-end: calc( calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)) );
}

}

/* Editor image */
.editor img {
    margin: 0 auto;
    max-height: 40rem;
    object-fit: contain;
}

/* Pagination styles */
.page-number li {
    margin: 0 0.25rem;
    border: 1px solid #a7b3ae;
    border-radius: .25rem;
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.4s ease;
    will-change: transform;
    backface-visibility: hidden;
    transform-origin: center;
}

    .page-number li a {
        display: block;
        min-width: 2rem;
        height: 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0.5rem;
    }


    .page-number li.activepage {
        background-color: var(--pagination-active-bg);
        color: var(--pagination-active-color);
        transform: scale(1.15);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    }

    .page-number li:hover {
        background-color: var(--pagination-hover-bg);
        color: var(--pagination-hover-color);
        transform: scale(1.15);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    }

/* FAQ styles */
.h_faq .h_faq_body {
    box-shadow: 0 3px 36px rgba(0, 0, 0, 0.08) inset, 0 3px 3px rgba(0, 0, 0, 0.1);
    border-width: 1px;
    padding: 0.75rem;
    background-color: var(--faq-body-bg);
    border-radius: .75rem;
}

.h_fag .accordion-menu .h_faq_question_body .faq_minuse_pluse {
    position: relative;
    margin-inline-start: 0.5rem;
}

    .h_fag .accordion-menu .h_faq_question_body .faq_minuse_pluse::after {
        display: block;
        content: "+";
        position: absolute;
        top: 50%;
        transform: translateY(-50%) rotate(0);
        transition: transform 300ms ease-in;
        inset-inline-end: 0;
        font-size: 2rem;
    }

.h_fag .accordion-menu .open .h_faq_question_body .faq_minuse_pluse::after {
    content: "-";
    transform: translateY(-50%) rotate(-180deg);
    transition: transform 300ms ease-in;
}

.h_faq .h_faq_header_title {
    padding-block: 0.75rem;
    padding-inline-start: 0.5rem;
    border-inline-start-width: 4px;
    border-color: var(--faq-border-design-header);
    font-size: var(--faq-header-title-size);
    line-height: var(--faq-header-title-leading);
}

.h_faq .h_faq_li {
    border-bottom-width: 1px;
    margin-inline-start: 0.5rem;
}

    .h_faq .h_faq_li > *:not(:last-child) {
        margin-bottom: calc(var(--spacing, 0.25rem) * 3);
        .h_faq .h_faq_li:last-child

{
    border-style: none;
    padding-bottom: 0;
}


.h_faq .h_faq_question_body {
    padding-top: 0.5rem;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.h_faq .h_faq_answer_body {
    padding-bottom: 1.25rem;
}

.h_fag .h_faq_answer_title {
    color: var(--faq-answer-title-color);
    font-size: var(--faq-answer-title-size);
}


/* Blockquote */
.editor blockquote {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-color: var(--editor-blockquote-bg);
    border-top: 3px solid var(--editor-blockquote-border-color);
    padding: 0.75rem;
    transition: all 0.2s ease;
}

    .editor blockquote:hover {
        background-color: var(--editor-blockquote-hover-bg);
    }

    .editor blockquote a {
        color: var(--editor-blockquote-a-color) !important;
    }

    .editor blockquote::before {
        content: "بیشتر بخوانید :";
        margin-left: 0.5rem;
        white-space: nowrap;
    }

    .editor blockquote p {
        margin: 0;
    }


.form .hspace-y-1 > *:not(:last-child) {
    margin-bottom: calc(var(--spacing, 0.25rem) * 1);
}

.form .hspace-y-2 > *:not(:last-child) {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
}
