/**
 * Styles for site part of component
 * 
 * We developed this code with our hearts and passion.
 * We hope you found it useful, easy to understand and change.
 * Otherwise, please feel free to contact us at contact@joomunited.com
 *
 * @package 	SEO Glossary
 * @copyright 	Copyright (C) 2012 JoomUnited (http://www.joomunited.com). All rights reserved.
 * @license 	GNU General Public License version 2 or later; http://www.gnu.org/licenses/gpl-2.0.html
 */

input#filter_search_module
{
    width: 165px;
}

.glossary ul.adminformlist, ul.adminformlist li {
    list-style: none outside none !important;
    margin: 0;
    padding: 0;
}

#seog-top-pagination ul li {
    list-style: none outside none !important;
    display: inline;
    margin: 0;
    padding: 0;
}

div.toolbar-list li
{
	list-style: none outside none !important;
	float:left;

}


div.glossaryalphabet {
	font-size: 14px;
	font-weight: bold;
	padding-bottom:15px;
    padding-top:15px;
	clear: left;
	text-align: center;
}

#com_glossary .seopagination-list .glossletselect {
background: #f4f3f4;
display: block;
width: 40px;
height: 40px;
text-align: center;
line-height: 40px;
color:#2b2a29;
padding: 0;
-webkit-border-radius: 50px !important;
-moz-border-radius: 50px !important;
border-radius: 50px !important;
}

div#glossarysearch {
	padding: 5px;
	margin: 10px 0;
}

div#glossarysearch input {
	margin: 5px 0;
}

div#glossarysearchmethod input {
	margin: 5px;	
}

.glossaryalphabet a
{
padding:2px;
}
/*.container  {
    clear: both;
    text-align: center;
    text-decoration: none;
}
.pagination {
    display: inline-block;
    margin: 0 auto;
    padding: 0;
}
.pagination div.limit {
    float: left;
    height: 22px;
    line-height: 22px;
    margin: 0 10px;
}
.counter
{
    float:right;
}*/

.glossary-group-items
{
    padding: 5px 0px 5px 0px;
}
div#com_glossary .container
{
	padding: 5px 0;
}
div#com_glossary .authorblock
{
     background:none;
}

/*css for jquery */

/* get rid of those system borders being generated for A tags */
/*a:active {
  outline:none;
}

:focus {
  -moz-outline-style:none;
}*/

/* links */

span.mytool a {
	border-bottom:1px dashed;
}

span.mytool a:hover {
	border-bottom:1px dashed;
	text-decoration:none;
}

div.listitem_socialmediashares {
	margin: 10px;
      float:left;
    width:100%;
}

div.term_socialmediashares {
	margin: 10px;
    float:left;
    width:100%;
}

div.socialmediabutton {
	float: left;
	overflow: visible;
}

.seogl-definition {
	text-align: justify;
	min-height:800px;
}

a.seoglGlossaryLink {
}

a.seoglGlossaryCurrentLink {
	font-weight: bold;
}

div.seogl-termdefinition {
	
}

div.seogl-termdefinition-more {
	
}

h1.seogl-term-title {
	
}

div.seogl-newterm {
	clear:both;
	margin: 10px;
}

#com_glossary .seopagination-list > li {
    display: inline;
    margin:0px;
    list-style-type: none;
}

#com_glossary .seopagination ul {
    display: inline-block;
    margin-bottom: 0;
    margin-left: 0;
    padding-left: 0;
}

#com_glossary .seopagination ul > li > a,#com_glossary .seopagination ul > li > span{
    padding: 4px;
     -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #dddddd;
    border-image: none;
    border-style: solid;
    border-width: 1px 1px 1px 0;
    float: left;
    line-height: 20px;
    text-decoration: none;
}
#com_glossary .seopagination ul > li:first-child > a, #com_glossary .seopagination ul > li:first-child > span
{
    border-bottom-left-radius: 4px;
    border-left-width: 1px;
    border-top-left-radius: 4px;
}
#com_glossary .seopagination ul > li:last-child > a, #com_glossary .seopagination ul > li:last-child > span
{
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}
@media  only screen and (max-width: 760px),(min-device-width: 768px) and (max-device-width: 1024px) {
#glossarylist thead
{
    display: none;
}
#glossarylist table,#glossarylist thead,#glossarylist tbody, #glossarylist th,#glossarylist td, #glossarylist tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	#glossarylist thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	#glossarylist td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
}

.glossary-group-title {
    background: #f5f5f5 none repeat scroll 0 0;
    color: #344150;
    font-size: 44px;
    font-weight: 600;
    margin: 0 0 24px;
    padding: 10px 15px;
    
}
.glossary-group-items ul > li > a {
    color: #67707c;
    font-size: 18px;
}
.glossary-group-items ul > .col-xs-12.col-sm-6.col-md-4.span3
{
    margin-left:0px;
}
#glossarysearchmethod
{
    width: 100%;
float: left;
}
div#glossarysearchmethod input
{
    float: none;
}
div#com_glossary div#glossarysearch form#searchForm div.input-append input#filter_search,
input#filter_search_module {
    border: 1px solid #e9e9e9;
    height: 40px;
    outline: none;
    margin: 0;
    
}
div#com_glossary div#glossarysearch form#searchForm div.input-append input#filter_search {background: #f4f3f4;padding:0px 45px 0px 20px; width: 100%}
div#com_glossary div#glossarysearch form#searchForm div.input-append input.button.btn {background: #fff;  cursor: pointer;}
input#filter_search_module {background: #fff; padding: 5px 15px; width: 100%;text-transform: capitalize;}

.srch-btn {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    margin-left: -40px;
    vertical-align: middle;
    z-index:11;
}
.srch-btn button {
    font-size: 0 !important;
    width: 40px;
    height: 40px;
    border: 0;
    cursor: pointer;
    background: #00b4f2 url(../images/srchIcn.png) center center no-repeat !important;
   background-size: 17px auto !important;
    
}
.srch-btn-inpt {
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

div#com_glossary div#glossarysearch form#searchForm div.input-append input#filter_search,
div#com_glossary div#glossarysearch form#searchForm div.input-append input.button.btn,
.srch-btn button, #com_glossary .seopagination ul > li.active > a, 
#com_glossary .seopagination ul>li.active>span,
input#filter_search_module,.input-append button, .custom-select select {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
      border-radius: 50px !important;
}

.seopagination { text-align: left !important}
#com_glossary .seopagination-list>li { margin: 0px; vertical-align: middle; display: inline-block;}
#com_glossary .seopagination ul > li > a, #com_glossary .seopagination ul>li>span { border: 0;color: #2b2a29; padding: 8px; }
#com_glossary .seopagination ul > li.active > a, #com_glossary .seopagination ul>li.active>span {
    background: #f4f3f4;
    display: block;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    padding: 0;
    color:#00b4f2;
}
.glossaryclear thead th {
    background: #f4f3f4;
    color:#2b2a29;
    font-weight: bold;
}
table#glossarylist tbody th, table#glossarylist tbody td, table#glossarylist tbody th a, table#glossarylist tbody td a,table#glossarylist tbody td em {
    color: #2b2a29;
}
table#glossarylist {
    border-collapse: collapse !important;
}
table#glossarylist thead th, table#glossarylist thead td { border: 1px solid #e9e9e9 !important;color:#2b2a29;}
table#glossarylist tr.row0,table#glossarylist tr.row1 {border: 1px solid #e9e9e9 !important;}
.input-append .srchbtn button {
    background: #00b4f2 url(../images/srchIcn.png) 12px center no-repeat;
    border: 1px solid #fff;
    color: #fff;
}
.srch-btn .input-append button {
    padding: 5px 5px 5px 15px;
    cursor: pointer;
    display: block;
}
.srch-btn .input-append button.clear-btn {
    border: 1px solid #e9e9e9;
    background: #fff url(../images/cross.png) 10px center no-repeat;
}
.dbl-btns { margin: 5px -2px 0;}
.sngl-btn { float: left; width: 50%; padding: 0 2px}

.sngl-btn button {background-size: 15px auto !important; width: 100%; }
input, button, a { outline: none !important }
#com_glossary .custom-select select.seoselect,.custom-select select.seoselect {
    background: #fff url(../images/dropIcn.png) 93% center no-repeat;
    background-size: 15px auto;
    padding: 5px 15px;
    border: 1px solid #e9e9e9;
    height: 40px;
    width: 100%;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    max-width: 250px;
    min-width: 130px;
}
#com_glossary .input-append, .input-prepend
{
    margin-bottom:0px;
}
.clearfix:after, .clearfix:before { content: ''; display: table; clear: both; }
.custom-select { margin-top: 0px;}
#com_glossary .custom-select.bigselect { max-width: 280px; padding:0;background:transparent;border:none;box-shadow:none;}
#searchForm  .custom-select.bigselect{padding-top:5px;}
.tm-wrapper { max-width: 1600px}
#glossarysearchmoduleheading { margin-bottom: 20px;}
#glossarysearchheading { margin-bottom: 10px;}
.srch-btn-inpt { max-width: 100%;margin-right:10px;}

.glossaryclear .glossaryclear tr, 
.glossaryclear .glossaryclear {
    background-color: transparent !important;
}
.tipthemeflatdarklight {
    background: #2b2a29;
}
.tipthemeflatdarklight p { margin: 0 }
.authorblock em, .hits em { font-weight: normal;color: #6a6c6f;font-style: normal;}
.authorblock,.hits { font-weight: 600;}
.glossaryclear { width: 100% !important }

.glossary-items .nav-pills >li>a {
    background: #2b2a29;
    color: #fff;
    border-radius: 40px;
    padding: 10px 20px;
    font-weight: normal;
    text-transform: capitalize;
    letter-spacing: .2px;
}
.glossary-items .nav>li>a:hover,.glossary-items .nav>li>a:focus { background-color: #4a4a49}
.masonary_seo {
    background: #f4f3f4;
    border: 0;
    padding-bottom: 10px;
}
.masonary_seo .view {
    margin: 0 0 15px;
    width: 100%;
    line-height: 200px;
}
.masonary_seo .title span {
    font-size: 20px;
}
.masonary_seo .title a { color: #2b2a29;}
.masonary_seo .title a:hover { text-decoration: none;color: #00a7fa;}
.masonary_seo .date {margin-top: 5px; color: #2b2a29;}
.glossary-group-items ul > li > a { color: #fff;}

div.socialmediabutton
{
        display: block;
    width: 70px;
    line-height: 0px;
    border-bottom: 2px solid #f5f5f5;
    text-align: center;
    text-decoration: none;
    font-size: 20px;
    font-weight: bold;
    padding: 5px;
}
@media screen and (min-width: 1460px)
{
    .grid-item { max-width:  33%; } 
}
@media screen and (max-width: 1460px) and (min-width: 768px) {
   .sngl-btn { width: 100% }
   .sngl-btn + .sngl-btn { margin-top: 5px }
   .input-append button.clear-btn,
   .input-append .srchbtn button { background-position: 22% center;}
    .grid-item { max-width:  33%; }

}
@media screen and (max-width: 991px) {
   .masonry-wrap .col-md-6 { width: 50% }

}

@media screen and (max-width: 767px) {
   .input-append button.clear-btn,
   .input-append .srchbtn button { background-position:30% center;}
   .glossaryclear td,#glossarylist td { padding: 10px 20px;}
   .grid-item { max-width:  49%; }

}


@media screen and (max-width: 560px) {
   .input-append button.clear-btn,
   .input-append .srchbtn button { background-position: 20% center;}

   .srch-btn-inpt { width: 100%;}
   div#com_glossary div#glossarysearch form#searchForm div.input-append input.button.btn { margin-top: 10px }
   .grid-item { max-width:  100%; }

}

 #com_glossary #glossarylist td, #com_glossary #glossarylist th {
    padding: 20px 30px;
}
#com_glossary  .glossary25
{
    min-width:30%;
}
 #com_glossary #glossarylist td
 {
    color: #2b2a29;    
 }
.masonary_seo .glossaryclear tr td { padding: 0 !important }
.masonary_seo .glossaryclear tr.row1, .masonary_seo .glossaryclear,
.masonary_seo table#glossarylist tbody tr.row1:hover td {background-color: transparent !important;}
.masonary_seo .glossaryclear tr td {
    font-size: 16px;
    line-height: 1.65 !important;
}
#com_glossary .tags  a.label {
    border: 0;
    background: #cacac9;
    display: inline-block;
    padding: 2px 10px;
    color: #fff;
    font-size: 16px;
    border-radius: 20px;
    margin-right: 3px;
    margin-bottom: 4px;
    text-transform: lowercase;
}
#com_glossary .tags  a.label:hover {background: #2b2a29; text-decoration: none;}
.nav-pills li {
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 5px;
}
.nav-pills>li>a { display: block; text-decoration: none;}

.flat.glossaryclear {
    font-family: sans-serif;
    -webkit-font-smoothing: antialiased;
    width: auto;
    overflow: auto;
    display: block;
}

table#glossarylist.flat.glossaryclear thead  th {
    background-color: #0096FD;
    font-weight: normal;
    color: white;
    padding: 20px 30px;
    text-align: center;
    color:#FFF;
}



.flat tr.header-seoglossary {
    font-size:115%;
}

.flat.glossaryclear td {
    padding: 20px 30px;
    color: rgb(111, 111, 111);
}

.flat th.glossary25 {
    min-width:160px;
    max-width:230px;
}

.flat th.glossary72 {
    min-width:200px;
    max-width:800px;
    width:100%;
}

.flat.glossaryclear tr.row0 {
    background-color: #f5f5f5;
}

.flat.glossaryclear tr.row1 {
    background-color:#eee;
}



table.flat#glossarylist {
    border: 0px !important;
    border-collapse: separate !important;
    border-spacing: 2px !important;
}

table.flat#glossarylist th, table#glossarylist td {
    border: 0px !important;

}
table.res#glossarylist {
    width: 100%;
    border-collapse: collapse !important;
    border: 0px !important;
}
/* Zebra striping */
table.res#glossarylist * tr:nth-of-type(odd) {
    background: #eee;
}
table.res#glossarylist * th {
    background: #333;
    color: white;
    font-weight: bold;
}
table.res#glossarylist * tr, table.res#glossarylist * td {
    border-collapse: collapse !important;
    border: 0px !important;
}
table.res#glossarylist * td, table.res#glossarylist * th {
    padding: 6px;
    text-align: left;
}

table.res#glossarylist tbody tr td.seoglossary-term {
    font-weight:bold;
}



/*
Max width before this PARTICULAR table.res gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

    /* Force table.res to not be like table.ress anymore */
    table.res,.res  thead,.res  tbody,.res  th,.res  td,.res  tr {
        display: block;
    }

    /* Hide table.res headers (but not display: none;, for accessibility) */
    table.res#glossarylist thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    table.res#glossarylist * tr { border: 1px solid #ccc; }

    table.res#glossarylist * td {
        /* Behave  like a "row" */
        border: none;
        /*border-bottom: 1px solid #eee;*/
        position: relative;
    }

    table.res#glossarylist * td:before {
        /* Now like a table.res header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }
    
        


}
.theme-responsive .srch-btn button
{
    background-color:#2b2a29 !important;
}
#com_glossary.theme-responsive .tags a.label
{
    background-color:#2b2a29 !important;    
}
#com_glossary .tags ul
{
  margin: 0px ;
list-style: none;
}
#com_glossary .tags ul li
{
    margin: 0px;
    vertical-align: middle;
    display: inline-block;
}

/* ========================================================================
   SEO Glossary Professional UI Refresh
   Scoped to .seogl-ui so legacy/admin/module styles remain untouched.
   ======================================================================== */
#com_glossary.seogl-ui {
    --seogl-accent: var(--cassiopeia-color-primary, var(--bs-primary, #2f5f86));
    /* Prefer the active template's global link colour. Keep the old accent only as a final fallback. */
    --seogl-link: var(--link-color, var(--bs-link-color, var(--cassiopeia-color-link, var(--cassiopeia-color-primary, var(--seogl-accent)))));
    --seogl-text: var(--body-color, var(--bs-body-color, inherit));
    --seogl-muted: var(--secondary-color, var(--bs-secondary-color, inherit));
    --seogl-border: var(--border-color, var(--bs-border-color, rgba(127, 127, 127, .28)));
    --seogl-surface: var(--body-bg, var(--bs-body-bg, transparent));
    --seogl-surface-soft: var(--tertiary-bg, var(--bs-tertiary-bg, var(--bs-secondary-bg, rgba(127, 127, 127, .08))));
    color: var(--seogl-text);
    font-size: 16px;
    line-height: 1.6;
}

#com_glossary.seogl-ui .seogl-page-title,
#com_glossary.seogl-ui .seogl-term-title,
#com_glossary.seogl-ui > h1 {
    color: var(--seogl-text);
    font-size: clamp(1.9rem, 3vw, 2.5rem);
    font-weight: 650;
    line-height: 1.2;
    letter-spacing: -0.02em;
    margin: 0 0 10px;
}

#com_glossary.seogl-ui .seogl-page-description,
#com_glossary.seogl-ui #seog-glossary-description {
    color: var(--seogl-muted);
    font-size: 1rem;
    line-height: 1.7;
    margin: 0 0 8px;
    max-width: 900px;
}

#com_glossary.seogl-ui .seogl-entry-count {
    color: var(--seogl-muted);
    font-size: .9rem;
    font-weight: 600;
    margin: 8px 0 18px;
}

#com_glossary.seogl-ui .seogl-newterm {
    clear: both;
    margin: 14px 0 18px;
}

#com_glossary.seogl-ui .seogl-newterm .btn {
    border-radius: 8px !important;
    font-weight: 600;
    min-height: 40px;
    padding: 8px 16px;
}

#com_glossary.seogl-ui div#glossarysearch {
    background: var(--seogl-surface-soft);
    border: 1px solid var(--seogl-border);
    border-radius: 12px;
    margin: 18px 0 12px;
    padding: 16px;
}

#com_glossary.seogl-ui #glossarysearchheading {
    color: var(--seogl-text);
    font-size: .9rem;
    font-weight: 650;
    margin: 0 0 8px;
}

#com_glossary.seogl-ui div#glossarysearch form#searchForm div.input-append input#filter_search,
#com_glossary.seogl-ui input#filter_search_module {
    background: var(--seogl-surface);
    border: 1px solid var(--seogl-border);
    border-radius: 8px !important;
    box-shadow: none;
    color: var(--seogl-text);
    height: 44px;
    padding: 0 48px 0 14px;
    transition: border-color .18s ease, box-shadow .18s ease;
}

#com_glossary.seogl-ui div#glossarysearch form#searchForm div.input-append input#filter_search:focus,
#com_glossary.seogl-ui input#filter_search_module:focus,
#com_glossary.seogl-ui .custom-select select.seoselect:focus {
    border-color: var(--seogl-accent);
    box-shadow: 0 0 0 3px rgba(47, 95, 134, .12);
}

#com_glossary.seogl-ui .srch-btn {
    right: 2px;
    top: 2px;
}

#com_glossary.seogl-ui .srch-btn button {
    background-color: var(--seogl-accent) !important;
    border-radius: 7px !important;
    height: 40px;
    width: 40px;
}

#com_glossary.seogl-ui div#glossarysearch form#searchForm div.input-append input.button.btn {
    background: var(--seogl-surface);
    border: 1px solid var(--seogl-border);
    border-radius: 8px !important;
    color: var(--seogl-text);
    min-height: 40px;
    padding: 8px 14px;
}

#com_glossary.seogl-ui .srch-btn .input-append button.clear-btn {
    background-color: var(--seogl-surface) !important;
    border-color: var(--seogl-border) !important;
    color: var(--seogl-text);
}

#com_glossary.seogl-ui .custom-select.bigselect {
    margin: 8px 0 14px;
    max-width: 320px;
}

#com_glossary.seogl-ui .custom-select select.seoselect,
#com_glossary.seogl-ui .custom-select.bigselect select.seoselect {
    background-color: var(--seogl-surface);
    background-image: none;
    appearance: auto;
    border: 1px solid var(--seogl-border);
    border-radius: 8px !important;
    color: var(--seogl-text);
    height: 44px;
    max-width: 320px;
    padding: 7px 38px 7px 13px;
}

#com_glossary.seogl-ui .glossaryalphabet {
    border-bottom: 1px solid var(--seogl-border);
    border-top: 1px solid var(--seogl-border);
    margin: 12px 0 22px;
    overflow: visible !important;
    padding: 12px 0;
    text-align: center !important;
    width: 100%;
}

#com_glossary.seogl-ui .glossaryalphabet .seopagination-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    justify-content: center;
    margin: 0;
    min-width: 0;
    overflow: visible !important;
    padding: 0;
    width: 100%;
}

#com_glossary.seogl-ui .seopagination-list > li {
    margin: 0;
}

#com_glossary.seogl-ui .glossaryalphabet .seopagination-list > li > a,
#com_glossary.seogl-ui .glossaryalphabet .seopagination-list > li > span,
#com_glossary.seogl-ui .seopagination-list .glossletselect {
    align-items: center;
    background: transparent;
    border: 1px solid var(--seogl-border) !important;
    border-radius: 8px !important;
    color: var(--seogl-link);
    display: inline-flex;
    font-size: .9rem;
    font-weight: 650;
    height: 36px;
    justify-content: center;
    line-height: 1;
    min-width: 36px;
    padding: 0 10px !important;
    text-decoration: none;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

#com_glossary.seogl-ui .glossaryalphabet .seopagination-list > li > a:hover,
#com_glossary.seogl-ui .glossaryalphabet .seopagination-list > li > a:focus {
    background: var(--seogl-surface-soft);
    border-color: currentColor !important;
    color: var(--seogl-link);
    text-decoration: none;
}

/* Keep the active letter in the template colour instead of forcing a product-specific blue/white pill. */
#com_glossary.seogl-ui .glossaryalphabet .seopagination-list > li.active > a,
#com_glossary.seogl-ui .glossaryalphabet .seopagination-list > li.active > span,
#com_glossary.seogl-ui .glossaryalphabet .seopagination-list > li.active .glossletselect {
    background: var(--seogl-surface-soft);
    border-color: currentColor !important;
    box-shadow: inset 0 -2px 0 currentColor;
    color: var(--seogl-link);
}

#com_glossary.seogl-ui .glossary-group-title {
    background: transparent;
    border-bottom: 1px solid var(--seogl-border);
    color: var(--seogl-text);
    font-size: clamp(1.65rem, 2.5vw, 2rem);
    font-weight: 650;
    line-height: 1.2;
    margin: 26px 0 16px;
    padding: 0 0 10px;
}

#com_glossary.seogl-ui .glossary-group-items {
    padding: 0 0 8px;
}

/* Neutral, template-aware alphabetical term cards. This overrides the legacy black pill style. */
#com_glossary.seogl-ui .glossary-items .glossary-group-items .nav-pills {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
    margin: 0;
    padding: 0;
}

#com_glossary.seogl-ui .glossary-items .glossary-group-items .nav-pills > li {
    display: block;
    margin: 0;
    max-width: none;
    padding: 0;
    width: auto;
}

#com_glossary.seogl-ui .glossary-items .glossary-group-items .nav-pills > li > a {
    background: var(--seogl-surface);
    border: 1px solid var(--seogl-border);
    border-radius: 9px;
    color: var(--seogl-link);
    display: block;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.45;
    padding: 11px 14px;
    text-decoration: none;
    transition: background-color .16s ease, border-color .16s ease, transform .16s ease;
}

#com_glossary.seogl-ui .glossary-items .glossary-group-items .nav-pills > li > a:hover,
#com_glossary.seogl-ui .glossary-items .glossary-group-items .nav-pills > li > a:focus {
    background: var(--seogl-surface-soft);
    border-color: currentColor;
    color: var(--seogl-link);
    text-decoration: none;
    transform: translateY(-1px);
}

#com_glossary.seogl-ui .seogl-empty-state {
    background: var(--seogl-surface-soft);
    border: 1px dashed var(--seogl-border);
    border-radius: 12px;
    margin: 24px 0;
    padding: 34px 20px;
    text-align: center;
}

#com_glossary.seogl-ui .seogl-empty-state h3 {
    color: var(--seogl-muted);
    font-size: 1.05rem;
    font-weight: 600;
    margin: 0;
}

#com_glossary.seogl-ui .grid[data-masonry] {
    margin-left: -8px;
    margin-right: -8px;
}

#com_glossary.seogl-ui .grid[data-masonry] > .grid-item {
    box-sizing: border-box;
    padding: 8px;
}

#com_glossary.seogl-ui .masonary_seo {
    background: var(--seogl-surface);
    border: 1px solid var(--seogl-border);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(25, 34, 44, .06);
    margin: 0;
    overflow: hidden;
    padding: 0 0 16px;
    width: 100%;
}

/* Legacy Masonry CSS floated the media block and caused the title/meta text to overlap it. */
#com_glossary.seogl-ui .masonary_seo .view {
    aspect-ratio: 16 / 9;
    background: var(--seogl-surface-soft);
    float: none !important;
    height: auto !important;
    line-height: normal !important;
    margin: 0 0 14px;
    max-width: none;
    overflow: hidden;
    position: relative;
    width: 100%;
}

#com_glossary.seogl-ui .masonary_seo .view img {
    display: block;
    height: 100% !important;
    object-fit: cover;
    position: static;
    width: 100% !important;
}

#com_glossary.seogl-ui .masonary_seo .view img.seogl-placeholder-image {
    object-fit: contain;
    opacity: .72;
    padding: 24px;
}

#com_glossary.seogl-ui .masonary_seo .view .mask {
    height: 100% !important;
    inset: 0;
    width: 100% !important;
}

#com_glossary.seogl-ui .masonary_seo .second-effect:hover .mask {
    background: rgba(20, 30, 40, .12);
    border: 0 solid transparent !important;
}

#com_glossary.seogl-ui .masonary_seo .second-effect a.info {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
}

#com_glossary.seogl-ui .masonary_seo .second-effect:hover a.info {
    transform: translate(-50%, -50%) scale(1);
}

#com_glossary.seogl-ui .masonary_seo .title,
#com_glossary.seogl-ui .masonary_seo .title span {
    display: block;
    height: auto !important;
    max-width: 100%;
    overflow: visible;
}

#com_glossary.seogl-ui .masonary_seo .title span {
    font-size: 1.08rem;
    line-height: 1.4;
    margin: 0 16px;
}

#com_glossary.seogl-ui .masonary_seo .title a {
    color: var(--seogl-link);
    font-weight: 650;
    overflow-wrap: anywhere;
    text-decoration: none;
}

#com_glossary.seogl-ui .masonary_seo .title a:hover {
    color: var(--seogl-link);
    text-decoration: underline;
    text-underline-offset: 3px;
}

#com_glossary.seogl-ui .masonary_seo .date {
    color: var(--seogl-muted);
    display: block;
    font-size: .86rem;
    line-height: 1.55;
    margin: 8px 16px 0;
    overflow-wrap: anywhere;
}

#com_glossary.seogl-ui .masonary_seo .text {
    color: var(--seogl-text);
    display: block;
    font-size: .94rem;
    line-height: 1.6;
    margin: 10px 16px;
    overflow-wrap: anywhere;
}

#com_glossary.seogl-ui .masonary_seo .custom_fields {
    display: block;
    margin: 0 16px;
}

#com_glossary.seogl-ui table#glossarylist {
    background: var(--seogl-surface);
    border: 1px solid var(--seogl-border) !important;
    border-collapse: separate !important;
    border-radius: 10px;
    border-spacing: 0 !important;
    margin: 18px 0 24px;
    overflow: hidden;
}

#com_glossary.seogl-ui table#glossarylist thead th,
#com_glossary.seogl-ui table#glossarylist thead td {
    background: var(--seogl-surface-soft) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--seogl-border) !important;
    color: var(--seogl-text) !important;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .035em;
    padding: 13px 18px;
    text-align: left;
    text-transform: uppercase;
}

#com_glossary.seogl-ui table#glossarylist tbody tr.row0,
#com_glossary.seogl-ui table#glossarylist tbody tr.row1 {
    background: var(--seogl-surface) !important;
    border: 0 !important;
}

#com_glossary.seogl-ui table#glossarylist tbody tr + tr td {
    border-top: 1px solid var(--seogl-border) !important;
}

#com_glossary.seogl-ui table#glossarylist tbody td {
    border: 0 !important;
    color: var(--seogl-text);
    line-height: 1.65;
    padding: 16px 18px;
    vertical-align: top;
}

#com_glossary.seogl-ui table#glossarylist tbody tr:hover td {
    background: var(--seogl-surface-soft) !important;
}

#com_glossary.seogl-ui table#glossarylist tbody td > a:first-child {
    color: var(--seogl-accent);
    font-weight: 650;
    text-decoration: none;
}

/* The legacy flat theme used display:block + width:auto on the table, which collapsed the content to the left. */
#com_glossary.seogl-ui table#glossarylist.flat.glossaryclear {
    display: table !important;
    overflow: visible !important;
    table-layout: fixed;
    width: 100% !important;
}

#com_glossary.seogl-ui table#glossarylist.flat th.glossary25,
#com_glossary.seogl-ui table#glossarylist.flat td:first-child {
    max-width: none;
    min-width: 0;
    width: 24%;
}

#com_glossary.seogl-ui table#glossarylist.flat th.glossary72,
#com_glossary.seogl-ui table#glossarylist.flat td:nth-child(2) {
    max-width: none;
    min-width: 0;
    width: 76%;
}

#com_glossary.seogl-ui table#glossarylist.flat tbody td:first-child > a:first-child {
    color: var(--seogl-link);
    font-size: 1rem;
    font-weight: 650;
}

#com_glossary.seogl-ui table#glossarylist.flat tbody td {
    overflow-wrap: anywhere;
}

#com_glossary.seogl-ui .authorblock,
#com_glossary.seogl-ui .hits {
    color: var(--seogl-muted);
    font-size: .9rem;
    font-weight: 500;
    margin-top: 10px;
}

#com_glossary.seogl-ui .authorblock em,
#com_glossary.seogl-ui .hits em {
    color: var(--seogl-muted);
    font-weight: 600;
}

#com_glossary.seogl-ui .tags {
    margin-top: 12px;
}

#com_glossary.seogl-ui .tags a.label {
    background: var(--seogl-surface-soft);
    border: 1px solid var(--seogl-border);
    border-radius: 6px;
    color: var(--seogl-text);
    font-size: .78rem;
    font-weight: 600;
    margin: 0 5px 5px 0;
    padding: 4px 8px;
    text-transform: none;
}

#com_glossary.seogl-ui .tags a.label:hover {
    background: var(--seogl-accent);
    border-color: var(--seogl-accent);
    color: #fff;
}

#com_glossary.seogl-ui .listitem_socialmediashares,
#com_glossary.seogl-ui .term_socialmediashares {
    float: none;
    margin: 12px 0;
    width: 100%;
}

#com_glossary.seogl-ui div.socialmediabutton {
    border: 0;
    float: none;
    display: inline-block;
    margin: 0 8px 4px 0;
    padding: 0;
    width: auto;
}

#com_glossary.seogl-ui .seogl-definition {
    min-height: 0;
}

#com_glossary.seogl-ui .pagination,
#com_glossary.seogl-ui #seog-top-pagination {
    margin: 18px 0;
}

@media screen and (max-width: 767px) {
    #com_glossary.seogl-ui {
        font-size: 15px;
    }

    #com_glossary.seogl-ui div#glossarysearch {
        padding: 13px;
    }

    #com_glossary.seogl-ui .custom-select.bigselect,
    #com_glossary.seogl-ui .custom-select select.seoselect,
    #com_glossary.seogl-ui .custom-select.bigselect select.seoselect {
        float: none !important;
        max-width: none;
        width: 100%;
    }

    #com_glossary.seogl-ui .glossaryalphabet .seopagination-list {
        flex-wrap: wrap;
    }

    #com_glossary.seogl-ui table#glossarylist tbody td {
        padding: 12px 14px;
    }

    #com_glossary.seogl-ui .masonary_seo {
        margin: 7px 0;
    }
}

@media (max-width: 640px) {
    #com_glossary.seogl-ui table#glossarylist.flat.glossaryclear {
        table-layout: auto;
    }

    #com_glossary.seogl-ui table#glossarylist.flat th.glossary25,
    #com_glossary.seogl-ui table#glossarylist.flat td:first-child {
        width: 34%;
    }

    #com_glossary.seogl-ui table#glossarylist.flat th.glossary72,
    #com_glossary.seogl-ui table#glossarylist.flat td:nth-child(2) {
        width: 66%;
    }
}

@media (prefers-reduced-motion: reduce) {
    #com_glossary.seogl-ui *,
    #com_glossary.seogl-ui *::before,
    #com_glossary.seogl-ui *::after {
        scroll-behavior: auto !important;
        transition: none !important;
    }
}


/* Compact front-end edit action: use a pencil icon instead of a large danger button. */
#com_glossary.seogl-ui .seogl-edit-link {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--seogl-accent);
    display: inline-flex;
    font-size: 1rem;
    height: 30px;
    justify-content: center;
    margin-left: 6px;
    padding: 0;
    text-decoration: none;
    vertical-align: middle;
    width: 30px;
}

#com_glossary.seogl-ui .seogl-edit-link:hover,
#com_glossary.seogl-ui .seogl-edit-link:focus {
    background: rgba(16, 46, 91, .08);
    color: var(--seogl-accent);
    text-decoration: none;
}

#com_glossary.seogl-ui .seogl-edit-link .icon-edit,
#com_glossary.seogl-ui .seogl-edit-link .icon-pencil {
    margin: 0;
}

/* Joomla 4/5/6 (Bootstrap 5) frontend compatibility.
 * Keep legacy hooks for old overrides, but make the component markup work with
 * current Bootstrap without relying on removed Bootstrap 2/3 utilities.
 */
#com_glossary.seogl-ui .seogl-search-form {
    margin: 0;
}

#com_glossary.seogl-ui .seogl-search-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: stretch;
}

#com_glossary.seogl-ui .seogl-search-input-group {
    display: flex;
    flex: 1 1 300px;
    max-width: 560px;
    min-width: 0;
    position: relative;
    width: auto;
}

#com_glossary.seogl-ui .seogl-search-input-group > .form-control {
    background: var(--seogl-surface);
    border: 1px solid var(--seogl-border);
    border-radius: 8px 0 0 8px !important;
    box-shadow: none;
    color: var(--seogl-text);
    flex: 1 1 auto;
    height: 44px;
    min-width: 0;
    padding: 8px 14px;
    width: 1%;
}

#com_glossary.seogl-ui .seogl-search-input-group > .form-control:focus {
    border-color: var(--seogl-accent);
    box-shadow: 0 0 0 3px rgba(47, 95, 134, .12);
    outline: 0;
    z-index: 2;
}

#com_glossary.seogl-ui .seogl-search-submit {
    align-items: center;
    border-radius: 0 8px 8px 0 !important;
    display: inline-flex;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
    padding: 8px 13px;
}

#com_glossary.seogl-ui .seogl-search-submit .icon-search {
    margin: 0;
}

#com_glossary.seogl-ui .seogl-search-clear {
    background: var(--seogl-surface);
    border: 1px solid var(--seogl-border);
    border-radius: 8px !important;
    color: var(--seogl-text);
    min-height: 44px;
    padding: 8px 14px;
}

#com_glossary.seogl-ui .seogl-search-clear:hover,
#com_glossary.seogl-ui .seogl-search-clear:focus {
    background: var(--seogl-surface-soft);
    border-color: var(--seogl-border);
    color: var(--seogl-text);
}

#com_glossary.seogl-ui .seogl-search-mode,
#com_glossary.seogl-ui .seogl-glossary-selector {
    max-width: 320px;
    width: 100%;
}

#com_glossary.seogl-ui .seogl-search-mode .form-select,
#com_glossary.seogl-ui .seogl-glossary-selector .form-select {
    background-color: var(--seogl-surface);
    border: 1px solid var(--seogl-border);
    border-radius: 8px !important;
    color: var(--seogl-text);
    min-height: 44px;
    width: 100%;
}

/* Bootstrap 5 uses btn-sm and col-*. The legacy class names remain in the
 * markup only as harmless compatibility hooks for old customer overrides. */
#com_glossary.seogl-ui .btn.btn-sm {
    line-height: 1.5;
}

@media (max-width: 575.98px) {
    #com_glossary.seogl-ui .seogl-search-input-group,
    #com_glossary.seogl-ui .seogl-search-clear,
    #com_glossary.seogl-ui .seogl-search-mode,
    #com_glossary.seogl-ui .seogl-glossary-selector {
        max-width: none;
        width: 100%;
    }
}

/* Bootstrap 5 popover used by the Bootstrap tooltip layout. */
.seogl-bootstrap-popover {
    --bs-popover-max-width: min(420px, calc(100vw - 32px));
    max-width: min(420px, calc(100vw - 32px));
}

.seogl-bootstrap-popover .popover-body {
    max-height: calc(100vh - 64px);
    overflow: auto;
    overflow-wrap: anywhere;
}

.seogl-bootstrap-popover img,
.seogl-bootstrap-popover iframe,
.seogl-bootstrap-popover video,
.seogl-bootstrap-popover table {
    max-width: 100%;
}

#com_glossary.seogl-ui .seogl-search-icon {
    display: block;
    height: 16px;
    width: 16px;
}