/* Google Fonts मधून 'Tiro Devanagari Hindi' फॉन्ट इंपोर्ट करा */
@import url('https://fonts.googleapis.com/css2?family=Tiro+Devanagari+Hindi:ital@0;1&display=swap');

/* Font Awesome आयकॉन व्यवस्थित दिसण्यासाठी */
.marathi-quote-buttons i {
    font-family: "Font Awesome 6 Brands", "Font Awesome 6 Free" !important;
    font-weight: 900 !important; /* काही आयकॉन्ससाठी वजन आवश्यक असू शकते */
}


/* Blockquote साठी स्टाईल */
blockquote.marathi-quote-enhanced {
    border: 2px solid #ffcc00; /* आकर्षक बॉर्डर रंग */
    padding: 20px;
    margin: 20px auto; /* पेजवर मध्यभागी दिसण्यासाठी */
    border-radius: 10px; /* गोलाकार कडा */
    background-color: #fffaf0; /* हलका पिवळा पार्श्वभूमी रंग */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* हलकी सावली */
    position: relative; /* बटणे योग्य ठिकाणी ठेवण्यासाठी */
    max-width: 700px; /* जास्तीत जास्त रुंदी */
    
    /* येथे फॉन्ट बदलला आहे */
    font-family: 'Tiro Devanagari Hindi', serif; /* तुमच्या पसंतीचा फॉन्ट */
    font-size: 1.15em;
    line-height: 1.7;
    color: #444;
    text-align: center; /* मजकूर मध्यभागी */
}

blockquote.marathi-quote-enhanced p {
    margin-bottom: 15px; /* कोट आणि बटणांमध्ये अंतर */
}

/* बटणांसाठी कंटेनर */
.marathi-quote-buttons {
    display: flex;
    flex-wrap: wrap; /* बटणे एका ओळीत बसली नाहीत तर पुढच्या ओळीत जातील */
    justify-content: center; /* बटणे मध्यभागी */
    gap: 12px; /* बटणांमधील अंतर */
    margin-top: 15px; /* कोट आणि बटणांमध्ये अंतर */
    padding-top: 10px; /* वरती थोडी जागा */
    border-top: 1px dashed #eee; /* बटणांच्या वरती हलकी डॅशड रेषा */
}

/* बटणांसाठी सामान्य स्टाईल */
.marathi-quote-buttons .copy-button,
.marathi-quote-buttons .share-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    border: none;
    border-radius: 6px;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none; /* लिंकचा अंडरलाईन काढण्यासाठी */
    color: white; /* मजकूर रंग */
    transition: background-color 0.3s ease, transform 0.2s ease; /* होव्हर इफेक्टसाठी */
}

/* होव्हर इफेक्ट */
.marathi-quote-buttons .copy-button:hover,
.marathi-quote-buttons .share-button:hover {
    transform: translateY(-2px); /* होव्हर केल्यावर थोडे वर सरकते */
    box-shadow: 0 4px 8px rgba(0,0,0,0.15); /* हलकी सावली */
}

/* विशिष्ट बटणांसाठी रंग */
.marathi-quote-buttons .copy-button {
    background-color: #007bff; /* निळा */
}
.marathi-quote-buttons .copy-button:hover {
    background-color: #0056b3;
}

.marathi-quote-buttons .whatsapp {
    background-color: #25D366; /* WhatsApp हिरवा */
}
.marathi-quote-buttons .whatsapp:hover {
    background-color: #1DA851;
}

.marathi-quote-buttons .facebook {
    background-color: #1877F2; /* Facebook निळा */
}
.marathi-quote-buttons .facebook:hover {
    background-color: #145cb3;
}

.marathi-quote-buttons .telegram {
    background-color: #0088CC; /* Telegram निळा */
}
.marathi-quote-buttons .telegram:hover {
    background-color: #006da8;
}

.marathi-quote-buttons .twitter { /* येथे बदल केला आहे */
    background-color: #000000; /* X (Twitter) साठी काळा रंग */
}
.marathi-quote-buttons .twitter:hover { /* येथे बदल केला आहे */
    background-color: #333333; /* होव्हर केल्यावर हलका काळा */
}

/* मोबाईल आणि लहान स्क्रीनसाठी प्रतिसादक डिझाइन */
@media (max-width: 600px) {
    blockquote.marathi-quote-enhanced {
        padding: 15px;
        margin: 15px auto;
        border-radius: 8px;
    }
    blockquote.marathi-quote-enhanced p {
        font-size: 1.05em;
    }
    .marathi-quote-buttons .copy-button,
    .marathi-quote-buttons .share-button {
        padding: 8px 12px;
    }
    .marathi-quote-buttons .copy-button i,
    .marathi-quote-buttons .share-button i {
        font-size: 1em;
    }
}