@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Montserrat:wght@400;600;700;800&display=swap');

@font-face {
  font-family: "bootstrap-icons";
  src: url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/fonts/bootstrap-icons.woff2?dd67030699838ea613ee6dbda90effa6") format("woff2"),
       url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/fonts/bootstrap-icons.woff?dd67030699838ea613ee6dbda90effa6") format("woff");
  font-display: swap;
}

.table tbody>tr>td.middle
{
    vertical-align: middle;
}

/* Bootstrap 3 active row/cell compatibility for Bootstrap 5 */
.table tr.active,
.table tr.active > td,
.table tr.active > th,
.table td.active,
.table th.active {
    --bs-table-bg-state: var(--bs-table-active-bg, rgba(0, 0, 0, 0.075));
    --bs-table-color-state: var(--bs-table-active-color);
    background-color: var(--bs-table-bg-state);
    color: var(--bs-table-color-state);
}

video {
	max-width: 100%;
    height: auto;
}

div.card ul.list-group {
	margin-bottom: 0px;
}

div.card ul.list-group li {
	padding: 7px 15px;
}

.widget {
	margin-bottom: 10px;
	overflow:hidden;
}

.nomargin {
    margin: 0;
}

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

.table-borderless { width:100%; }
.table-borderless td,
.table-borderless th {
    border: none;
}

.img-thumbnail {
	margin-bottom: 10px;
}

iframe, embed, object {
	max-width: 100%;
}
          
/* Prevent responsive inline form */          
table.borderBottom tr  td {
  border-bottom:1pt solid #dfdfdf;
}

table.borderBottom tr:last-child td {
   border-bottom: none;
}

.navbar-nav table, .dropdown-menu table {
	margin-bottom: 0px;
	font-size: 14px !important; 
}   

.odd { background-color: #eeeeee;}
.even { background-color: transparent; }
.selected { background-color: #B8C9FA; }          
          
body {
    font-family: 'Lato', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6;
    letter-spacing: -0.01em;
}

.form-select, .form-control {
    font-size: 14px !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', sans-serif !important;
    text-wrap: balance;
}

h1 { font-size: 28px !important; line-height: 1.2; margin-bottom: 6px; margin-top: 0px; font-weight: 700 !important; letter-spacing: -0.02em; }
h2 { font-size: 22px !important; line-height: 1.2; font-weight: 700 !important; letter-spacing: -0.02em; }
h3 { color: #505050; font-size: 18px !important; line-height: 1.2; font-weight: 600 !important; }
h4 { font-size: 16px !important; line-height: 1.2; font-weight: 600 !important; }
h5 { font-size: 14px !important; line-height: 1.2; font-weight: 600 !important; }
h6 { font-size: 12px !important; line-height: 1.2; font-weight: 600 !important; }

h1 a, h2 a, h3 a { color: black; }

.text16 { font-size: 16px; }
.text15 { font-size: 15px; }
.text14 { font-size: 14px; }
.text13 { font-size: 13px; }
.text12 { font-size: 12px; }
.text11 { font-size: 11px; }
.text10 { font-size: 10px; }
.text9 { font-size: 9px; }

.btn-group {
	margin-left: 0;
    margin-right: 5px;
    margin-top: 3px;
}

/* Small devices (tablets, 768px and up) */
@media (max-width: 768px) 
{ 
    div[class^="col"]{padding-left:10px; padding-right:10px;}
}


.btn-secondary {
    background-color: #e6e6e6 !important;
    border: 1px solid #adadad !important;
    color: #333 !important;
    padding: 2px 10px !important;
}

.btn-secondary:hover {
    background-color: #d4d4d4 !important;
    border-color: #8c8c8c !important;
    color: #333 !important;
}

.btn-primary {
    background-color: #43557F !important;
    border: 1px solid #3E485F !important;
    color: #fff !important;
    padding: 2px 10px !important;
}

.btn-primary:hover {
    background-color: #3E485F !important;
    border-color: #162853 !important;
    color: #fff !important;
}

.btn-toolbar > .btn + .btn,
.btn-toolbar > .btn-group + .btn, 
.btn-toolbar > .btn + .btn-group, 
.btn-toolbar > .btn-group + .btn-group {
    margin-left: 0px;
}

.highlight	{ background-color: #dfdfdf; }

.badge {
    padding: 5px 5px;
}

.navbar .badge {
    border-radius: 50rem !important; /* pill shape */
    line-height: 1 !important;
    background-color: white;
    color: black;
    padding: 3px 3px;
    font-size: 10px;
    font-weight: normal;
    vertical-align: text-bottom;
}

.navbar .badge-alert {
    background-color: #dc3545 !important; /* Bootstrap 5 danger red */
    color: white !important;
}



.voteQuestion {
	font-weight: bold;
}

.voteReplies {
	margin-bottom: 7px;
}


h2, h3 {
    margin-bottom: 15px;
    margin-top: 5px;
}

.padding5 {  padding: 5px; }
.padding10 {  padding: 10px; }

/*
http://colorschemedesigner.com/
Primary Color:
				
43557F	3E485F	162853	7B90BF	8D9CBF
Secondary Color A:
				
544682	484062	251755	8D7DC1	9B8FC1
Secondary Color B:
				
367272	345555	114A4A	6FB8B8	83B8B8
Complementary Color:
				
BE9C5A	8E7B56	7B5C1D	DEC186	DEC99E
	
*/	


:root {
    --hs-feature-bg: #dbeaf9;
    --hs-body-bg: #ffffff;
    --hs-accent: #43557F;
}

[data-bs-theme="dark"] {
    --hs-feature-bg: #121212 !important;
    --hs-body-bg: #121212 !important;
    --hs-accent: #7B90BF;
}

html,body{
    height: 100%;
    background-color: var(--hs-body-bg);
    accent-color: var(--hs-accent);
}

.dropdown:hover {
    cursor: pointer;
}

.feature {
	padding-top: 40px;	
	background-color: #dbeaf9;	
	border-bottom: 1px solid #dfdfdf;
}

.feature .featureLogo {
	margin-left: 3px;
	margin-right: 30px;
}

.container {
	padding:0px;
}

.feature .card {
	margin-bottom:5px;
}

ins.adsbygoogle[data-ad-status="unfilled"] {
    display: none !important;
}

.banner {
	text-align: center;
	margin-bottom: 8px;
}

.vertical-center {
  min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
  min-height: 100vh; /* These two lines are counted as one :-)       */

  display: flex;
  align-items: center;
}

.feature .featureContent {
	padding-top:3px;
	padding-left: 8px;
}

.feature .card-body {
	margin: 0 0px;
	padding: 5px;
	overflow: hidden;
}

/*
#divContent {
	padding: 5px 0;
}
*/

.feature .card-footer {
	padding: 3px 5px;
}

.submenu {
	margin-left: 8px !important;
	margin-bottom: 0px !important;
}

#divWidgets .card-body {
	padding: 5px;
	overflow: hidden;
}


.feature-image {
	/*background-color: blue;*/
	height: auto;
	width:100%;
	object-fit: cover;
}

.img-fluid-noblock {
	height: auto;
	width: 100%;
}

.feature-image img {
	width: 100%;
	max-height: 200px;
}

.footer {
	background-color: #dbeaf9; 
	min-height: 40px;	
	border-top: 1px solid #dfdfdf;
	padding-top: 8px;
	padding-bottom: 8px;
}

.comment, .links, .uploads, .postinfo { 	
	margin-bottom: 7px; 
	margin-top: 0; 
	padding-top: 0; 
	padding-bottom: 0;
	overflow: hidden;
}

.links {
	opacity: 0.75;
	word-wrap: break-word;
	overflow-wrap: break-word;
	word-break: break-word;
}

.muted a {
	color: none;
}

.post .actionbar {
	font-size: 90%;
}

.post .comment {
	max-width: 100%;
	word-wrap: break-word;
	overflow-wrap: break-word;
	word-break: break-word;
	color:inherit;
	font-size: inherit;
}

.post .comment img {
	max-width: 100%;
	color:inherit;
	font-size: inherit;
}

.comment p {
	margin-bottom: 4px; 
	margin-top: 0px; 
	padding-top: 0px; 
	padding-bottom: 4px;
} 

.subject {
	font-size: 14px;
	font-weight: bold; 
}

a, .nav-link {
	color: #9B0000;
	text-decoration: none;
}

.navbar-nav .nav-link, .navbar-brand, .navbar-toggler, #mobileMemberNavbar {
    color: white !important;
    text-decoration: none !important;
    /*font-size: 15px !important;*/
}

.navbar-nav .nav-link:hover, .navbar-brand:hover, .navbar-toggler:hover, #mobileMemberNavbar:hover {
    color: white !important;
    text-decoration: none !important;
}

.nav-link.active {
    color: #555555 !important;
    font-weight: bold;
}

#divContent a, .comment a, .card-body a {
    color: #9B0000;
}

a:hover, .dropdown-item:hover, .nav-link:hover {
	text-decoration: underline;
	color: #9B0000;
}

.dropdown-item {
    color: #212529; /* BS5 default dark */
}


#divWidgets .card-header a, .navbar-brand { 
	color: black !important;
}

hr {
	border: 0;
	height: 1px;
	color: #cccccc;
	background-color: #cccccc;
	opacity: 1;
}

.container hr {
	margin: 4px 0;	
}

hr.dotted {
	background:none;
	border-bottom: 1px dashed; 
}

.post {
	margin-bottom: 5px;
	padding: 5px;
}

.post .card-body {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: #F8F8F8;
	background-color: transparent;
}

.black, .black a, a.black { 
    color: #000000 !important; 
}

.white,	.white a { color: #FFFFFF; }
.bgwhite { background-color: #FFFFFF; }
.black, .black a { color: #000000; }
.red, .red a { color: #CC0000; }
.lightred, .lightred a { color:  #926060; }
.green, .green a { color: DarkGreen; }
.grey, .grey a { color: #888888; }
.dimmed, .dimmed a { color: #888888; }

.rowicon { float:left; margin-right:10px; }
.rowtext { overflow: hidden; display:block; }

.hide { display: none; }

.post .card {
    background-color: transparent;
}

.icon-10 {  font-size: 10px; line-height: 1; }
.icon-15 {  font-size: 15px; line-height: 1; }


.post .bi-chevron-down {
	opacity: .40;
}

.post .bi-chevron-down:hover {
	opacity: .85;
}

.post .bi  {
	opacity: .50;
	font-size: 12px;
}


.rowNoMargin {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.rowNoPadding {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

.firstpost {background-color: #f7f7f7;}

.starpost  {background-color: #EBFCEE;}
.starpost2 {background-color: #DEFCE3;}
.starpost3 {background-color: #CCFCD5;}
.starpost4 {background-color: #B9FAC4;}
.starpost5 {background-color: #9DFAAD;}
.smoke { background-color: #F0F0F0; }

/* ---- TABLES ---- */

table {
	border-collapse: collapse;
	font-size: 12px;
}

td, th { padding: 2px; vertical-align: top;}

.bottom { vertical-align: bottom; }
/*.middle { display: table-cell;  vertical-align: middle; }*/
.center {   text-align: center; }
.right {   text-align: right; }

alignTop { vertical-align: top; }

table.padded0 td { padding: 0px; vertical-align: middle; }
table.padded1 td { padding: 1px; vertical-align: middle; }
table.padded2 td { padding: 2px; vertical-align: middle; }
table.padded3 td { padding: 3px; vertical-align: middle; }
table.padded4 td { padding: 4px; vertical-align: middle; }


/* NAVBAR */

.card-header {
    padding: 0.3rem 0.75rem !important;
    background-color: #e2e2e2 !important;
    font-size: 14px;
    font-weight: bold;
}

/*.card-body {
    padding: 0.75rem !important;
}
    */

.table-sm th, .table-sm td {
    padding: 0.2rem 0.3rem !important;
}

/* Apply striping to tables with the .table-striped class */
table.table-striped {
    --bs-table-striped-bg: #e2e2e2;
}

[data-bs-theme="dark"] table.table-striped {
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
}

table.table-striped tr:nth-of-type(odd) > td,
table.table-striped tr:nth-of-type(odd) > th {
    background-color: var(--bs-table-striped-bg) !important;
    box-shadow: inset 0 0 0 9999px var(--bs-table-striped-bg) !important;
}

/* Ensure .selected and .active classes override the striping */
table.table-striped tr.selected > td,
table.table-striped tr.selected > th,
table.table-striped tr.active > td,
table.table-striped tr.active > th {
    background-color: #B8C9FA !important;
    box-shadow: inset 0 0 0 9999px #B8C9FA !important;
}

.btn {
    margin-right: 5px !important;
    margin-bottom: 5px !important;
    border: 1px solid #adadad !important;
}

.nav-tabs .nav-item, .nav-pills .nav-item, .nav-pills li {
    margin-right: 10px !important;
}

@media (min-width: 992px) {
    .navbar { 
        height: 35px !important;
        min-height: 35px !important; 
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        background-color: rgba(67, 85, 127, 0.8) !important;
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
    }

    .navbar-nav .nav-link {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        line-height: 35px !important;
    }

    .navbar-brand {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        line-height: 35px !important;
    }
}

.post {
	margin-bottom: 2px !important;
	padding: 3px !important;
}
.form-check-label {
    padding-left: 10px !important;
}

label input[type="radio"], label input[type="checkbox"] {
    margin-right: 10px !important;
}

.post {
	margin-bottom: 2px !important;
	padding: 3px !important;
}

.post .col-10 {
    flex: 1 !important;
}
.navbar, .bg-dark, .navbar-dark {
    background-color: #43557F !important;
}

.navbar-brand {
    color: white !important;
    line-height: 34px;
    padding: 0;
    font-size: 15px;
    font-weight: bold;
}

.navbar-nav {
    margin-left: 0;
    margin-right: 0;
}

.navbar-nav > li {
    margin-right: 5px;
    margin-left: 0;
}

.navbar-nav .nav-link {
    line-height: 34px;
    max-height: 34px;
    padding: 0 0 0 10px;
    margin: 0;
}

.nav-pills > li > a {
    padding: 3px 8px;
}

.navbar > .container .navbar-brand {
    margin: 0;
}

.navbar .container .navbar-collapse {
    background-color: #43557F;
}

/* Light mode specific overrides */
[data-bs-theme="light"] {
    --bs-card-cap-bg: #eeeeee;
}

/* Dark mode specific overrides */
[data-bs-theme="dark"] {
    --bs-body-bg: #121212;
    --bs-card-bg: #1e1e1e;
    --bs-card-cap-bg: #2b3035;
    --bs-border-color: #373b3e;
    --bs-body-color: #e0e0e0;
}

[data-bs-theme="dark"] a, 
[data-bs-theme="dark"] .nav-link,
[data-bs-theme="dark"] #divContent a, 
[data-bs-theme="dark"] .comment a, 
[data-bs-theme="dark"] .card-body a,
[data-bs-theme="dark"] .card-footer a {
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .nav-link.active {
    color: #adb5bd !important;
}

[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-header a,
[data-bs-theme="dark"] .card-header a:hover,
[data-bs-theme="dark"] #divWidgets .card-header a {
    color: #fff !important;
    background-color: #2b3035 !important;
}

[data-bs-theme="dark"] h1, [data-bs-theme="dark"] h1 a, 
[data-bs-theme="dark"] h2, [data-bs-theme="dark"] h2 a, 
[data-bs-theme="dark"] h3, [data-bs-theme="dark"] h3 a {
    color: #fff !important;
}

[data-bs-theme="dark"] .navbar, 
[data-bs-theme="dark"] .bg-dark, 
[data-bs-theme="dark"] .navbar-dark,
[data-bs-theme="dark"] .navbar .container .navbar-collapse { 
    background-color: #1a1d20 !important; 
}

[data-bs-theme="dark"] .feature,
[data-bs-theme="dark"] .footer,
[data-bs-theme="dark"] .card {
    background-color: #121212 !important;
    border-color: #373b3e !important;
}

[data-bs-theme="dark"] .postinfo, 
[data-bs-theme="dark"] .dimmed, 
[data-bs-theme="dark"] .text-muted {
    color: #adb5bd !important;
}

[data-bs-theme="dark"] hr {
    background-color: #373b3e !important;
    color: #373b3e !important;
    opacity: 1;
}

[data-bs-theme="dark"] .firstpost {background-color: #373b3e;}
[data-bs-theme="dark"] .starpost  {background-color: #132d30;}
[data-bs-theme="dark"] .starpost2 {background-color: #18383c;}
[data-bs-theme="dark"] .starpost3 {background-color: #1d4447;}
[data-bs-theme="dark"] .starpost4 {background-color: #225053;}
[data-bs-theme="dark"] .starpost5 {background-color: #275d60;}
[data-bs-theme="dark"] .smoke {background-color: #2b3035;}

[data-bs-theme="dark"] .btn {
    border: 1px solid #6c757d !important;
}

[data-bs-theme="dark"] .btn-secondary {
    background-color: #343a40 !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .btn-secondary:hover {
    background-color: #495057 !important;
    border-color: #adb5bd !important;
}

[data-bs-theme="dark"] .btn-primary {
    background-color: #43557F !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .btn-primary:hover {
    background-color: #546690 !important;
    border-color: #adb5bd !important;
}

[data-bs-theme="dark"] .post .card-body {
    background-color: #1e1e1e !important;
}

[data-bs-theme="dark"] .card-body *,
[data-bs-theme="dark"] .card-footer * {
    color: #fff !important;
}

/* Remove borders and outlines from navbar elements */
.navbar .btn, 
.navbar .btn-link, 
.navbar .navbar-toggler, 
.navbar .navbar-brand {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
}



.profile-thumb-offcanvas {
    width: 32px !important;
    height: 32px !important;
    object-fit: cover !important;
}

@media (min-width: 992px) {
    .offcanvas.d-lg-none {
        display: none !important;
    }
}

@media (max-width: 991px) {
    .hybrid-dropdown {
        display: none !important;
    }
}

.hybrid-dropdown {
    border-radius: 8px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

#adminMenu .btn {
    font-size: 12px !important;
    line-height: 1 !important;
    color: #6c757d !important; /* Standard grey for visibility */
    box-shadow: none !important;
    outline: none !important;
    padding: 1px 2px !important;
    border-radius: 50% !important;
    transition: all 0.2s ease;
}

#adminMenu .btn:hover {
    color: #000 !important;
    background-color: rgba(0,0,0,0.08) !important;
}

[data-bs-theme="dark"] #adminMenu .btn:hover {
    color: #fff !important;
    background-color: rgba(255,255,255,0.1) !important;
}

.offcanvas-body .text-secondary,
.offcanvas-body .btn-outline-secondary {
    color: white !important;
}

.offcanvas-body .btn-outline-secondary {
    border-color: white !important;
}

/* Responsive YouTube player using native aspect-ratio */
.youtube-player {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}

/* Custom CSS Grid layout to replace Bootstrap's row/cols in the main template */
.hs-main-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem; /* Matches Bootstrap's gx-4 gap */
}

@media (min-width: 768px) {
    .hs-main-grid {
        grid-template-columns: 6fr 4fr 2fr;
    }
}

/* Unify club logo dimensions in the header list banner */
.club-logo, .user-avatar {
    height: 60px !important;
    max-width: 95px !important;
    width: 100% !important;
    object-fit: contain !important;
}

/* --- Premium Visual Upgrades --- */

/* Interactive transitions */
.btn {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn:hover {
    transform: translateY(-1px);
}

#divContent a:not(.btn):not(:has(img)), .comment a:not(.btn):not(:has(img)) {
    position: relative;
    text-decoration: none !important;
}

#divContent a:not(.btn):not(:has(img))::after, .comment a:not(.btn):not(:has(img))::after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: -2px;
    left: 0;
    background-color: currentColor;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

#divContent a:not(.btn):not(:has(img)):hover::after, .comment a:not(.btn):not(:has(img)):hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

/* Sleek inputs */
.form-control, .form-select {
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select {
    border: 1px solid #373b3e !important;
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

.form-control:focus, .form-select:focus {
    border-color: #43557F !important;
    box-shadow: 0 0 0 3px rgba(67, 85, 127, 0.2) !important;
}

[data-bs-theme="dark"] .form-control:focus, [data-bs-theme="dark"] .form-select:focus {
    border-color: #7B90BF !important;
    box-shadow: 0 0 0 3px rgba(123, 144, 191, 0.2) !important;
}

/* Custom scrollbars */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #334155;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #475569;
}