/* =====================================================================
   هویت بصری ایرانی ادبراه — بنر صفحه‌ها، فوتر و اصلاح اجزای صفحه‌های داخلی
   بعد از persian-theme.css لود می‌شود. همه‌ی رنگ‌ها از متغیرهای قالب فعال می‌آیند.
   ===================================================================== */

/* نام‌های قدیمی متغیرها (فایل‌های CSS صفحه‌ها) → متغیرهای قالب فعال */
:root[data-bs-theme] {
    --dark-blue         : var(--primary-text);
    --light-slate       : var(--secondary-text);
    --accent-gold       : var(--accent-color);
    --accent-blue       : var(--button-primary);
    --card-bg           : var(--surface);
    --page-bg           : var(--background-secondary);
    --title-font        : BoldFarhang, sans-serif;
    --accent-color-light: var(--accent-color-soft);
    /* منوی داشبورد کاربر */
    --dash-bg-dark        : var(--surface);
    --dash-bg-hover       : var(--accent-color-soft);
    --dash-text-color     : var(--secondary-text);
    --dash-text-hover     : var(--primary-text);
    --dash-active-bg      : var(--button-primary);
    --dash-active-border  : var(--accent-color);
    --dash-separator-color: var(--border-subtle)
}

/* ---------- بنر عنوان صفحه‌های داخلی (زیر نوار ناوبری، داخل هدر) ---------- */
.hero-section::before {
    content         : '';
    position        : absolute;
    inset           : 0;
    pointer-events  : none;
    background-color: var(--accent-color);
    opacity         : .13;
    -webkit-mask    : url(/img/miniature/orn/khatam.svg) 0 0 / 60px 60px repeat,
                      linear-gradient(to left, transparent 0, #000 55%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask            : url(/img/miniature/orn/khatam.svg) 0 0 / 60px 60px repeat,
                      linear-gradient(to left, transparent 0, #000 55%, transparent 100%);
    mask-composite  : intersect
}

.page-banner {
    position       : relative;
    z-index        : 2;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    gap            : 1.5rem;
    padding        : .5rem 3rem 1.9rem
}

.page-banner-title {
    margin     : 0;
    font-size  : 2.4rem;
    line-height: 1.5 !important
}

.page-banner-subtitle {
    margin   : .35rem 0 0;
    max-width: 640px;
    color    : var(--secondary-text);
    font-size: 1.1rem
}

.page-banner-emblem {
    position   : relative;
    flex-shrink: 0;
    width      : 74px;
    margin-top : .25rem
}

.page-banner-emblem img {
    position: relative;
    display : block;
    width   : 100%;
    height  : auto
}

.page-banner-halo {
    position        : absolute;
    inset           : -9px -9px 0;
    background-color: var(--accent-color);
    opacity         : .35;
    -webkit-mask    : url(/img/miniature/orn/arch.svg) 0 0 / 100% 100% no-repeat;
    mask            : url(/img/miniature/orn/arch.svg) 0 0 / 100% 100% no-repeat
}

@media (max-width: 768px) {
    .page-banner        { padding: .25rem 1.25rem 1.5rem }
    .page-banner-title  { font-size: 1.7rem }
    .page-banner-emblem { width: 56px }
}

/* ---------- فوتر ---------- */
.main-footer {
    background-color: var(--surface-strong);
    border-top      : 0;
    margin-top      : 4rem;
    padding-top     : 4.5rem
}

.main-footer::after {
    content         : '';
    position        : absolute;
    inset           : 0;
    pointer-events  : none;
    background-color: var(--accent-color);
    opacity         : .08;
    -webkit-mask    : url(/img/miniature/orn/khatam.svg) 0 0 / 60px 60px repeat;
    mask            : url(/img/miniature/orn/khatam.svg) 0 0 / 60px 60px repeat
}

.main-footer > * {
    position: relative;
    z-index : 1
}

.footer-brand {
    display        : flex;
    align-items    : center;
    gap            : 1.25rem;
    padding-bottom : 2rem;
    margin-bottom  : 2rem;
    border-bottom  : 1px solid var(--border-subtle)
}

.footer-brand .brand-lockup .brand-wordmark {
    width: 96px
}

.footer-brand p {
    margin   : 0;
    font-size: 1.15rem;
    color    : var(--secondary-text)
}

.footer-column h4 {
    display      : flex;
    align-items  : center;
    gap          : .55rem;
    margin-bottom: 1rem
}

.footer-column h4::before {
    content         : '';
    width           : 16px;
    height          : 16px;
    background-color: var(--accent-color);
    -webkit-mask    : url(/img/miniature/orn/star8.svg) center / contain no-repeat;
    mask            : url(/img/miniature/orn/star8.svg) center / contain no-repeat
}

.footer-column ul li a {
    color: var(--primary-text) !important
}

.footer-column ul li a:hover {
    color: var(--accent-color-strong) !important
}

.footer-bottom,
.end-footer {
    border-color: var(--border-subtle) !important
}

.footer-bottom p {
    color: var(--secondary-text)
}

/* ---------- اجزای قدیمی site.css که رنگ ثابت (تیره/بنفش) داشتند ---------- */
.team-card {
    background-color: var(--surface);
    color           : var(--primary-text);
    border          : 2px solid var(--accent-color);
    border-radius   : 14px;
    box-shadow      : inset 0 0 0 5px var(--surface), inset 0 0 0 6px var(--border-subtle);
    transition      : transform .25s ease, box-shadow .25s ease
}

.team-card:hover {
    transform : translateY(-6px);
    box-shadow: inset 0 0 0 5px var(--surface), inset 0 0 0 6px var(--accent-color), var(--card-shadow)
}

.team-card > img {
    padding      : 9px 9px 0;
    border-radius: 18px 18px 0 0
}

.member-name,
.team-member-name {
    color: var(--primary-text)
}

.member-role,
.team-member-role {
    color: var(--accent-color-strong)
}

.social-links a,
.team-social-links a {
    color: var(--secondary-text) !important
}

.social-links a:hover,
.team-social-links a:hover {
    color: var(--accent-color-strong) !important
}

.join-us-section {
    position        : relative;
    overflow        : hidden;
    background-color: var(--surface);
    border          : 2px solid var(--accent-color);
    border-radius   : 16px;
    box-shadow      : inset 0 0 0 5px var(--surface), inset 0 0 0 6px var(--border-subtle)
}

.join-us-content p {
    color: var(--secondary-text)
}

.primary-button {
    display      : inline-flex;
    align-items  : center;
    background   : linear-gradient(180deg, var(--accent-color), color-mix(in srgb, var(--accent-color) 82%, #000));
    color        : var(--on-accent) !important;
    border       : 2px solid var(--accent-color-strong);
    border-radius: 12px;
    padding      : .75rem 1.75rem
}

.primary-button:hover {
    background: linear-gradient(180deg, var(--accent-color-strong), var(--accent-color))
}

.schedule-details,
.breadcrumbs a,
.breadcrumbs span {
    color: var(--secondary-text)
}

/* ---------- حالت خالی (وقتی داده‌ای برای نمایش نیست) ---------- */
.empty-state {
    display       : flex;
    flex-direction: column;
    align-items   : center;
    gap           : .6rem;
    margin        : 1rem auto;
    padding       : 2.5rem 1.5rem;
    max-width     : 560px;
    text-align    : center
}

.empty-state img {
    width  : 88px;
    height : auto;
    opacity: .9
}

.empty-state h2,
.empty-state h3 {
    margin   : .5rem 0 0;
    font-size: 1.4rem
}

.empty-state p {
    margin: 0;
    color : var(--secondary-text)
}

/* ---------- داشبورد کاربر ---------- */
.dashboard-nav {
    background-color: var(--surface) !important;
    border          : 2px solid var(--accent-color);
    border-radius   : 14px;
    box-shadow      : inset 0 0 0 5px var(--surface), inset 0 0 0 6px var(--border-subtle) !important
}

.dashboard-card {
    background-color: var(--surface);
    border          : 2px solid var(--accent-color);
    border-radius   : 14px;
    box-shadow      : inset 0 0 0 5px var(--surface), inset 0 0 0 6px var(--border-subtle)
}

.dashboard-nav ul li a.active {
    color: #fff !important
}

/* ---------- جزئیات اثر / مقاله / جشنواره ---------- */
.content-hero {
    border     : 2px solid var(--accent-color) !important;
    box-shadow : inset 0 0 0 5px var(--surface), inset 0 0 0 6px var(--border-subtle), var(--card-shadow) !important
}

.breadcrumbs ol {
    display   : flex;
    flex-wrap : wrap;
    gap       : .5rem;
    margin    : 0;
    padding   : 0;
    list-style: none;
    color     : var(--secondary-text)
}

.breadcrumbs li + li::before {
    content     : 'ƒA';
    margin-inline-end: .5rem;
    color       : var(--accent-color)
}

.blog-thumb {
    border       : 2px solid var(--accent-color);
    border-radius: 12px;
    background   : var(--surface-strong)
}

.share-box {
    gap: .75rem
}

.share-btn {
    display        : inline-flex;
    align-items    : center;
    justify-content: center;
    width          : 38px;
    height         : 38px;
    border         : 1.5px solid var(--accent-color);
    border-radius  : 10px;
    background     : var(--surface-strong);
    color          : var(--primary-text);
    transition     : background-color .2s ease
}

.share-btn:hover {
    background-color: var(--accent-color-soft)
}

.share-btn img {
    width : 22px;
    height: 22px
}

.alert {
    border-radius: 12px
}

/* ---------- ورود و ثبت‌نام ---------- */
.row.justify-content-center > [class*="col-"] > .card {
    border      : 2px solid var(--accent-color);
    box-shadow  : inset 0 0 0 5px var(--surface), inset 0 0 0 6px var(--border-subtle) !important
}

.row.justify-content-center > [class*="col-"] > .card .card-body {
    padding: 2rem !important
}

.row.justify-content-center > [class*="col-"] > .card .text-center a {
    display      : block;
    margin-top   : .6rem;
    padding      : .55rem 1rem;
    border       : 1.5px solid var(--border-subtle);
    border-radius: 10px;
    transition   : border-color .2s ease, background-color .2s ease
}

.row.justify-content-center > [class*="col-"] > .card .text-center a:hover {
    border-color    : var(--accent-color);
    background-color: var(--accent-color-soft)
}

/* ---------- صفحه‌ی «به‌زودی» ---------- */
.coming-soon-container {
    position: relative
}

.coming-soon-art {
    width        : 110px;
    height       : auto;
    margin-bottom: .75rem;
    filter       : drop-shadow(0 6px 12px #0003)
}

.coming-soon-container .newsletter-form .form-control {
    background-color: var(--surface)
}

.empty-state + .btn,
.text-center > .btn {
    margin-top: .5rem
}

/* ---------- پلن‌های اشتراک در صفحه‌ی اصلی ---------- */
.landing-plans-lead {
    margin: -.75rem 0 1.75rem
}

.landing-plans-grid {
    display              : grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 340px));
    justify-content      : center;
    gap                  : 1.5rem
}

.landing-plan {
    position      : relative;
    display       : flex;
    flex-direction: column;
    gap           : .75rem;
    padding       : 2rem 1.6rem 1.6rem;
    text-align    : center;
    overflow      : hidden;
    transition    : transform .25s ease
}

.landing-plan:hover {
    transform: translateY(-6px)
}

.landing-plan.is-featured {
    border-color: var(--accent-color-strong);
    box-shadow  : inset 0 0 0 5px var(--surface), inset 0 0 0 7px var(--accent-color), var(--card-shadow)
}

.landing-plan h3 {
    margin   : 0;
    font-size: 1.6rem
}

.landing-plan-desc {
    margin: 0;
    color : var(--secondary-text)
}

.landing-plan-badge {
    position        : absolute;
    top             : 16px;
    left            : -38px;
    width           : 150px;
    padding         : .2rem 0;
    transform       : rotate(-45deg);
    background-color: var(--button-primary);
    color           : #fff;
    font-size       : .85rem;
    font-weight     : 700
}

.landing-plan-price {
    display       : flex;
    flex-direction: column;
    align-items   : center;
    margin        : .5rem 0
}

.landing-plan-price strong {
    font-family: BoldFarhang, sans-serif;
    font-size  : 2.8rem;
    line-height: 1.2;
    color      : var(--accent-color-strong)
}

.landing-plan-price span {
    color: var(--secondary-text)
}

.landing-plan-features {
    margin    : 0 0 .75rem;
    padding   : 0;
    list-style: none;
    text-align: start
}

.landing-plan-features li {
    padding   : .5rem 0;
    border-top: 1px solid var(--border-subtle)
}

.landing-plan-features i {
    margin-inline-end: .5rem;
    color            : var(--accent-color)
}

.landing-plan-cta {
    margin-top: auto
}