/*
Theme Name: PUNJAB SEED CORPORATION
Theme URI: https://psc.agripunjab.gov.pk/
Template: hello-elementor
Author: Deveonic Team
Author URI: https://deveonic.com/
Description: A custom WordPress theme developed for Punjab Seed Corporation. This theme is designed to provide a professional, user-friendly, and responsive interface for showcasing the organization’s services, resources, and initiatives. Built with modern web standards, it ensures optimized performance, accessibility, and scalability for future enhancements.
Tags: responsive, custom-theme, agriculture, government, corporate, clean-design, seo-friendly, accessibility-ready, translation-ready, elementor-compatible, bootstrap, modern-layout
Version: 1.0.0.1756666294
Updated: 2025-08-31 18:51:34

*/

add_action('wp_footer', 'psc_sticky_facebook');

function psc_sticky_facebook() {
    ?>
    
    <div id="psc-facebook-tab">
        <a
            href="https://www.facebook.com/PUNJAB.SEED.CORPORATION/"
            target="_blank"
            rel="noopener noreferrer"
            aria-label="Punjab Seed Corporation Facebook"
        >
            <span class="psc-facebook-icon">
                <svg viewBox="0 0 24 24" aria-hidden="true">
                    <path d="M14 8h3V4h-3c-3.3 0-5 1.7-5 5v3H6v4h3v8h4v-8h3l1-4h-4V9c0-.7.3-1 1-1z"/>
                </svg>
            </span>

            <span class="psc-facebook-text">
                Facebook
            </span>
        </a>
    </div>

    <style>
        #psc-facebook-tab {
            position: fixed;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            z-index: 999999;
        }

        #psc-facebook-tab a {
            display: flex;
            align-items: center;

            width: 48px;
            height: 52px;

            background: #80bd18;
            color: #fff;

            text-decoration: none;

            overflow: hidden;

            transition: width .35s ease;
        }

        /* Icon */
        #psc-facebook-tab .psc-facebook-icon {
            width: 48px;
            min-width: 48px;
            height: 52px;

            display: flex;
            align-items: center;
            justify-content: center;
        }

        #psc-facebook-tab svg {
            width: 25px;
            height: 25px;
            fill: #fff;
        }

        /* Text */
        #psc-facebook-tab .psc-facebook-text {
            white-space: nowrap;

            font-size: 15px;
            font-weight: 600;

            padding-left: 6px;
            padding-right: 20px;

            opacity: 0;
            transform: translateX(15px);

            transition:
                opacity .25s ease,
                transform .35s ease;
        }

        /* Desktop hover */
        #psc-facebook-tab a:hover {
            width: 190px;
        }

        #psc-facebook-tab a:hover .psc-facebook-text {
            opacity: 1;
            transform: translateX(0);
        }

        /* Mobile */
        @media (max-width: 767px) {

            #psc-facebook-tab {
                right: 0;
                max-width: 100vw;
            }

            #psc-facebook-tab a {
                width: 48px;
                max-width: calc(100vw - 8px);
                height: 50px;
            }

            #psc-facebook-tab a:hover {
                width: min(180px, calc(100vw - 8px));
            }

            #psc-facebook-tab .psc-facebook-icon {
                width: 48px;
                min-width: 48px;
                height: 50px;
            }

            #psc-facebook-tab .psc-facebook-text {
                font-size: 14px;
                padding-left: 6px;
                padding-right: 12px;
            }
        }

        /* Small phones */
        @media (max-width: 380px) {

            #psc-facebook-tab a:hover {
                width: calc(100vw - 8px);
            }

            #psc-facebook-tab .psc-facebook-text {
                font-size: 13px;
            }
        }
    </style>

    <?php
}