/*
TBOC Basic Style CSS
Author: Tactical Beard Owners Club
Version: 1.3.0
License: Internal Usage Only
License URI: https://www.tacticalbeardownersclub.com/
*/

/******************/
/* Basic Settings */
/******************/

/* Reset default margin and padding on all elements */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: #000000;
}

body.custom-background {
    background-attachment: fixed !important;
}

/* Font Antialiased */
html:has(#tboc-theme-page), body:has(#tboc-theme-page) {
    font-family: var(--tboc-font-body);
    font-weight: var(--tboc-font-weight-regular);
    -webkit-font-smoothing: antialiased;
    overflow-y: scroll;
}

/* Set full width and height for body */
body:has(#tboc-theme-page) {
    width: 100vw;
    height: 100vh;
}

/* Use flex-box to position header, main and footer */
#tboc-theme-page {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Set full width for header, footer */
#tboc-theme-page header, #tboc-theme-page footer {
    width: 100%;
}

#tboc-theme-page main {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Set fixed position for header */
#tboc-theme-page header {
    position: fixed;
    top: 0;
}

/* Set fixed position for footer */
#tboc-theme-page footer {
    position: fixed;
    bottom: 0;
}

/***********/
/* Styling */
/***********/

/* Site Header */
.tboc-site-header {
    color: var(--tboc-color-widget-bg);
    display: flex;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    justify-content: center;
    order: 0;
    width: 100%;
    min-height: 50px;
    text-align: center;
    /* background: rgb(0, 0, 0, 0.2); */
    align-items: center;
    padding: var(--tboc-gutter-medium);
}

    /* Site Header Background */
    .tboc-site-header::after {
        position: absolute;
        background: var(--tboc-bg-tboc-theme-danger) repeat-x top;
        content: "";
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 0.5;
        z-index: 1;
    }

.tboc-site-title {
    z-index: 2;
}

.tboc-site-title h1,
.tboc-site-title p {
    color: var(--tboc-color-widget-bg);
    font-family: var(--tboc-font-strong);
    font-size: 28px;
    font-weight: var(--tboc-font-weight-normal);
    text-transform: uppercase;
    display: inline-block;
    margin: 0;
    padding: 0 var(--tboc-gutter-small);
    line-height: 1;
}

.tboc-site-title p {
    font-family: var(--tboc-font-body);
    font-weight: var(--tboc-font-weight-normal);
    font-size: var(--tboc-font-size-xlarge);
}

.tboc-site-title h1 a {
    color: var(--tboc-color-widget-bg);
    text-decoration: none;
}

/* Center the logo image using absolute positioning */
.tboc-site-logo-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Site default logo */
.tboc-site-default-logo  {
    width: 287px;
    height: auto;
    filter: drop-shadow(var(--tboc-drop-shadow-logo-full));
}

/* Site custom logo */
.tboc-site-custom-logo {
    width: 100%;
    height: auto;
    filter: drop-shadow(var(--tboc-drop-shadow-logo-full));
}

/* Site Footer */ 
.tboc-site-footer {
    font-family: var(--tboc-font-body);
    font-weight: var(--tboc-font-weight-medium);
    font-size: var(--tboc-font-size-small);
	color: var(--tboc-color-widget-bg);
	display: flex;
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: auto;
	align-self: auto;
	justify-content: center;
	order: 0;
	width: 100%;
	min-height: 50px;
	text-align: center;
	/* background: rgb(0, 0, 0, 0.2); */
	align-items: center;
    padding: var(--tboc-gutter-medium);
}

    /* Site Footer Background */
    .tboc-site-footer::after {
        background: var(--tboc-bg-tboc-theme-danger) repeat-x top;
        content: "";
        -moz-transform: scaleY(-1);
        -o-transform: scaleY(-1);
        -webkit-transform: scaleY(-1);
        transform: scaleY(-1);
        filter: FlipV;
        -ms-filter: "FlipV";	
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 100%;
        opacity: 0.5;
        z-index: 1;
    }

.tboc-site-info {
    line-height: 1.5;
    padding-top: 0;
    z-index: 2;
}

.tboc-site-info a {
    text-decoration: underline;
    color: var(--tboc-color-widget-bg);
}

    .tboc-site-info a:focus,
    .tboc-site-info a:hover {
        color: var(--tboc-color-form-field-bg);
    }

.tboc-site-name,
.tboc-site-copyright {
    display: inline-block;
    padding: 0 var(--tboc-gutter-xsmall);
}

.tboc-site-name {
    font-weight: var(--tboc-font-weight-bold);
}