/* =============================================
   CAT PARADISE - FARSI (PERSIAN) STYLES
   RTL Layout + Vazirmatn Font
   ============================================= */

/* ===== FARSI FONT ===== */
@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap');

/* Apply Vazirmatn to all text when language is Persian */
html[lang="fa"] body,
html[lang="fa"] button,
html[lang="fa"] input,
html[lang="fa"] textarea,
html[lang="fa"] select {
    font-family: 'Vazirmatn', 'Segoe UI', Tahoma, sans-serif;
    direction: rtl;
}

/* ===== RTL LAYOUT ===== */
html[lang="fa"] {
    direction: rtl;
}

html[lang="fa"] body {
    text-align: right;
}

/* ===== NAVIGATION ===== */
html[lang="fa"] .navbar .container {
    flex-direction: row-reverse;
}

html[lang="fa"] .nav-menu {
    flex-direction: row-reverse;
}

html[lang="fa"] .logo {
    flex-direction: row-reverse;
}

html[lang="fa"] .logo-text {
    text-align: right;
}

/* Dropdown positioning for RTL */
html[lang="fa"] .nav-menu .dropdown-menu {
    left: auto;
    right: 50%;
    transform: translateX(50%) translateY(10px);
}

html[lang="fa"] .nav-menu .dropdown:hover .dropdown-menu {
    transform: translateX(50%) translateY(0);
}

html[lang="fa"] .nav-menu .dropdown-menu li a:hover {
    padding-left: 20px;
    padding-right: 25px;
}

/* ===== HERO SECTION ===== */
html[lang="fa"] .hero-content {
    text-align: right;
}

html[lang="fa"] .hero-buttons {
    flex-direction: row-reverse;
    justify-content: flex-start;
}

html[lang="fa"] .hero-features {
    flex-direction: row-reverse;
    justify-content: flex-start;
}

html[lang="fa"] .feature {
    flex-direction: row-reverse;
}

/* ===== ABOUT SECTION ===== */
html[lang="fa"] .about-content {
    direction: rtl;
}

html[lang="fa"] .about-feature {
    flex-direction: row-reverse;
}

html[lang="fa"] .experience-badge {
    right: auto;
    left: -40px;
}

/* ===== CAT VISION SECTION ===== */
html[lang="fa"] .vision-content {
    direction: rtl;
}

html[lang="fa"] .fact-card {
    flex-direction: row-reverse;
}

html[lang="fa"] .fact-card:hover {
    transform: translateX(-10px);
}

html[lang="fa"] .vision-comparison {
    flex-direction: row-reverse;
}

/* ===== SERVICES ===== */
html[lang="fa"] .service-features li {
    text-align: right;
}

/* ===== TESTIMONIALS ===== */
html[lang="fa"] .testimonial-author {
    flex-direction: row-reverse;
}

/* ===== CONTACT ===== */
html[lang="fa"] .contact-item {
    flex-direction: row-reverse;
}

html[lang="fa"] .contact-item i {
    margin-left: 0;
    margin-right: 0;
}

/* ===== FOOTER ===== */
html[lang="fa"] .footer-social {
    flex-direction: row-reverse;
    justify-content: flex-end;
}

html[lang="fa"] .newsletter-form {
    flex-direction: row-reverse;
}

/* ===== BUTTONS ===== */
html[lang="fa"] .btn-primary i,
html[lang="fa"] .btn-secondary i,
html[lang="fa"] .btn-outline i {
    margin-left: 8px;
    margin-right: 0;
}

/* ===== CONTENT PAGES (nutrition, diseases, etc) ===== */
html[lang="fa"] .content-layout {
    direction: rtl;
}

html[lang="fa"] .content-sidebar ul li a {
    border-left: none;
    border-right: 3px solid transparent;
    padding-right: 12px;
    padding-left: 0;
}

html[lang="fa"] .content-sidebar ul li a:hover {
    border-right-color: var(--primary-yellow);
    padding-right: 18px;
    padding-left: 0;
}

html[lang="fa"] .content-section h2 i {
    margin-right: 0;
    margin-left: 15px;
}

html[lang="fa"] .content-list li {
    padding-right: 35px;
    padding-left: 0;
}

html[lang="fa"] .content-list li::before {
    left: auto;
    right: 0;
}

html[lang="fa"] .content-table th,
html[lang="fa"] .content-table td {
    text-align: right;
}

html[lang="fa"] .accordion-header {
    text-align: right;
}

html[lang="fa"] .danger-item i {
    margin-right: 0;
    margin-left: 8px;
}

html[lang="fa"] .info-box {
    border-left: none;
    border-right: 5px solid var(--primary-yellow);
}

html[lang="fa"] .info-box.warning {
    border-right-color: #FF9800;
}

html[lang="fa"] .info-box ul li {
    padding-right: 25px;
    padding-left: 0;
}

html[lang="fa"] .info-box ul li::before {
    left: auto;
    right: 0;
}

/* ===== BOOKING PAGE ===== */
html[lang="fa"] .suite-option ul li {
    flex-direction: row-reverse;
}

html[lang="fa"] .addon-card label {
    flex-direction: row-reverse;
}

html[lang="fa"] .summary-row,
html[lang="fa"] .sidebar-row {
    flex-direction: row-reverse;
}

html[lang="fa"] .contact-item i {
    flex-shrink: 0;
}

html[lang="fa"] .form-buttons {
    flex-direction: row-reverse;
}

html[lang="fa"] .radio-group {
    flex-direction: row-reverse;
}

/* ===== AI CHAT ASSISTANT ===== */
html[lang="fa"] .ai-chat-window {
    direction: rtl;
}

html[lang="fa"] .ai-message {
    flex-direction: row-reverse;
}

html[lang="fa"] .user-message {
    flex-direction: row-reverse;
}

html[lang="fa"] .ai-bubble {
    border-radius: 18px 18px 4px 18px;
}

html[lang="fa"] .user-message .ai-bubble {
    border-radius: 18px 18px 18px 4px;
}

html[lang="fa"] .ai-chat-input {
    flex-direction: row-reverse;
}

html[lang="fa"] .quick-q {
    font-family: 'Vazirmatn', sans-serif;
}

/* ===== LOGO TEXT ===== */
html[lang="fa"] .logo-text h1 {
    font-family: 'Vazirmatn', sans-serif;
    letter-spacing: 0;
}

html[lang="fa"] .logo-text span {
    letter-spacing: 1px;
}

/* ===== NUMBER OVERRIDE ===== */
/* Keep English numbers even in Farsi layout */
html[lang="fa"] input[type="tel"],
html[lang="fa"] input[type="number"],
html[lang="fa"] input[type="date"] {
    direction: ltr;
    text-align: right;
}

/* ===== HERO DOTS/PARTICLES - keep as is ===== */
html[lang="fa"] .hero-particle,
html[lang="fa"] .hero-paw,
html[lang="fa"] .hero-dot,
html[lang="fa"] .hero-fish,
html[lang="fa"] .hero-cat {
    direction: ltr;
}

/* ===== FLOATING ELEMENTS - keep as is ===== */
html[lang="fa"] .floating-elements {
    direction: ltr;
}

/* ===== FARSI MOBILE FIXES ===== */
@media (max-width: 968px) {
    html[lang="fa"] .nav-menu > li > a {
        text-align: right;
        padding-right: 10px;
    }
    
    html[lang="fa"] .nav-menu .dropdown-menu {
        margin: 0 20px 0 0;
        border-right: 3px solid var(--primary-yellow);
        border-left: none;
    }
    
    html[lang="fa"] .nav-menu .dropdown-menu li a {
        text-align: right;
        padding-right: 20px;
    }
    
    html[lang="fa"] .hero-buttons {
        flex-direction: column;
        width: 100%;
    }
    
    html[lang="fa"] .hero-buttons a {
        width: 100%;
        text-align: center;
    }
    
    html[lang="fa"] .hero-features {
        flex-direction: column;
    }
}