/*
|--------------------------------------------------------------------------
| Britain Times Share
|--------------------------------------------------------------------------
*/

.btss-wrapper {

    margin: 34px 0;

    padding: 18px;

    background: #fafafa;

    border: 1px solid #e8e8e8;

    border-radius: 6px;

}

.btss-share {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 10px;

}

/* ----------------------------------
   Links & Buttons
-----------------------------------*/

.btss-share a,
.btss-copy-link,
.btss-print {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 9px 16px;

    background: #ffffff;

    border: 1px solid #dddddd;

    border-radius: 4px;

    box-shadow: 0 1px 2px rgba(0,0,0,.04);

    color: #111111;

    text-decoration: none;

    font-family: inherit;

    font-size: 14px;

    font-weight: 600;

    line-height: 1;

    cursor: pointer;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        color .2s ease;

}

/* Slight emphasis */

.btss-copy-link{

    border-color:#c8c8c8;

}

/* ----------------------------------
   Hover
-----------------------------------*/

.btss-share a:hover,
.btss-copy-link:hover,
.btss-print:hover{

    background:#f4f4f4;

    border-color:#cfcfcf;

    box-shadow:0 2px 6px rgba(0,0,0,.07);

    text-decoration:none;

}

/* Brand colours only on hover */

.btss-share a[href*="linkedin"]:hover{

    color:#0A66C2;

}

.btss-share a[href*="twitter"]:hover,
.btss-share a[href*="x.com"]:hover{

    color:#000;

}

.btss-share a[href*="facebook"]:hover{

    color:#1877F2;

}

.btss-share a[href^="mailto"]:hover{

    color:#666;

}

.btss-copy-link:hover,
.btss-print:hover{

    color:#333;

}

/* ----------------------------------
   Focus
-----------------------------------*/

.btss-share a:focus-visible,
.btss-copy-link:focus-visible,
.btss-print:focus-visible{

    outline:2px solid #888;

    outline-offset:2px;

}

/* ----------------------------------
   Copied
-----------------------------------*/

.btss-copy-link.copied{

    color:#2e7d32;

    background:#eef8ef;

    border-color:#b7ddb9;

}

/* ----------------------------------
   Mobile
-----------------------------------*/

@media (max-width:768px){

    .btss-wrapper{

        padding:14px;

        margin:28px 0;

    }

    .btss-share{

        gap:8px;

    }

    .btss-share a,
    .btss-copy-link,
    .btss-print{

        padding:8px 14px;

        font-size:13px;

    }

}