/*   
Theme Name: Tommy Johnagin — SWP 2026
Theme URI:
Description: Tommy Johnagin custom presentation powered by the 2026 SWP Framework.
Author: Scott Sandry
Author URI: https://scottsandry.com
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Version: 2026.1.284
Tags: light, two-columns, right-sidebar, fixed-width, custom-background, post-formats
*/

/* SWP Framework color system.
 * Site-specific overrides belong in style-theme.css.
 */
:root {
	--swp-color-primary: #1769aa;
	--swp-color-primary-dark: #0f4c81;
	--swp-color-primary-soft: #eaf3f9;
	--swp-color-text: #1f2933;
	--swp-color-muted: #627384;
	--swp-color-border: #c7d3dc;
	--swp-color-surface: #f3f7fa;
	--swp-color-surface-alt: #e8f0f5;
	--swp-color-footer: #eaf1f6;
	--swp-color-white: #ffffff;
	--swp-color-header: var(--swp-color-primary-soft);
	--swp-site-max-width: 1280px;
	--swp-site-gutter: 24px;
	--swp-404-background: #efefed;
	--swp-404-text: #252a2f;
	--swp-404-muted: #666b70;
	--swp-404-button-bg: #343a40;
	--swp-404-button-text: #ffffff;
	--swp-404-button-hover-bg: #1f2428;
	--swp-404-button-hover-text: #ffffff;
	--swp-404-focus: #8c9297;
}

/* Contents
 
 Global
 Header 
 Navigation
 Sidebar
 Post
 Meta
 Footer
 Misc
 Pagination
 Forms
 Comments 
 Typography
 
*/


/* Global */
/* ---------------------------------------------------------- */

body {
	margin: 0px;
	padding: 0px;
	overflow-x: hidden;
}

html {
	padding: 0px;
	margin: 0px;
}

/* Flex Grid */
.outer_wrap {
}

.inner_wrap {
	padding: 20px 0px 20px 0px;
}

.flex_10,
.flex_20,
.flex_25,
.flex_33,
.flex_40,
.flex_50,
.flex_60,
.flex_66,
.flex_75,
.flex_80,
.flex_90,
.flex_100 {
	display: inline;
	float: left;
	position: relative;
}

.push {
	margin: 1px 0px 0px 0px;
}

.flex_10 {
	width: 10%;
}

.flex_20 {
	width: 20%;
}

.flex_25 {
	width: 25%;
}

.flex_33 {
	width: 33%;
}

.flex_40 {
	width: 40%;
}

.flex_50 {
	width: 50%;
}

.flex_60 {
	width: 60%;
}

.flex_66 {
	width: 66%;
}

.flex_75 {
	width: 75%;
}

.flex_80 {
	width: 80%;
}

.flex_90 {
	width: 90%;
}

.flex_100 {
	width: 100%;
}

.flex_pad {
	padding: 10px;
}

.flex_vert_pad {
	padding: 20px 0px 20px 0px;
}

.clear {
	clear: both;
}

/* Sidebar */
/* ---------------------------------------------------------- */

#sidebar {
	margin: 0px 0px 0px 20px;
}

#sidebar img {
	max-width: 100%;
	height: auto;
}

#pages,
#archives,
#categories,
#feeds,
#sidebarmeta,
#blogroll {
	margin: 0px;
}

.sidebaritem {
	padding: 0px 0px 10px 0px;
	margin: 0px 0px 10px 0px;
	border-bottom: 1px dotted #ccc;
}

/* Post */
/* ---------------------------------------------------------- */

.postmetadata {
	padding: 0px 0px 5px 0px;
	color: var(--swp-color-muted);
	font-size: 12px;
	line-height: 18px;
	text-transform: capitalize;
	clear: both;
}

.meta {
	padding: 0px 0px 10px 0px;
}

object,
video {
	max-width: 100%;
	width: 100%;
}

.wp-caption {
	max-width: 95%;
	height: auto;
}

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

.wp-caption img,
.gallery-icon img {
	max-width: 98%;
	height: auto;
}

.content {
	padding: 30px;
}

.archive .post:not(.swp-post-card),
.blog .post:not(.swp-post-card) {
	padding: 0px 0px 50px 0px;
}

.post:not(.swp-post-card):not(.swp-content-entry),
.type-post:not(.swp-post-card):not(.swp-content-entry),
.type-page:not(.swp-post-card):not(.swp-content-entry) {
	padding: 0px 0px 10px 0px;
}

.textcenter {
	text-align: center;
}

.textleft {
	text-align: left;
}

.textright {
	text-align: right;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.alignleft {
	float: left;
	margin: 0px 20px 20px 0px;
	clear: both;
}

.alignright {
	float: right;
	margin: 0px 0px 20px 20px;
	clear: both;
}

.attachment-post-thumbnail {
	float: left;
	min-width: inherit;
	border: 5px solid #fff;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px #888;
	box-shadow: 0 0 2px #888;
	overflow: hidden;
	margin: 0px 20px 20px 0px;
}

/* Meta */
/* ---------------------------------------------------------- */

.author {
	background: var(--swp-color-surface);
	padding: 20px 20px 0px 0px;
	margin: 0px 0px 20px 0px;
}

.author img {
	float: left;
	margin: 0px 20px 10px 0px;
}

.authorinfo h3 {
	margin: 0px 0px 10px 0px;
	padding: 0px;
}

.authorinfo p {
	margin: 0px;
	padding: 0px 0px 20px 20px;
	font-size: 12px;
}

/* Footer */
/* ---------------------------------------------------------- */

#footer {
	border-top: solid 8px var(--swp-color-primary-dark);
	margin: 0px 0px 0px 0px;
	text-align: center;
	padding: 20px;
	color: #848484;
}

.outer_footer_wrap {
}

.inner_footer_wrap {
}

/* Misc */
/* ---------------------------------------------------------- */

.sticky {
	background: url(images/must-read.png) no-repeat right top;
	background-color: var(--swp-color-white);
}

.gallery-caption {
	width: 90%;
	padding: 0px;
	margin: 0 auto;
}

.bypostauthor {
}

.wp-caption-text {
	font-size: 10px;
	color: var(--swp-color-muted);
	border: 1px solid var(--swp-color-border);
	text-align: center;
	background-color: var(--swp-color-surface);
	padding: 0px;
	margin: 0px 0px 20px 0px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption-dd {
	font-size: 11px;
	line-height: 17px;
	padding: 0 4px 5px;
	margin: 0;
}

/* Pagination */
/* ---------------------------------------------------------- */

.pagenavi {
	margin: 0 auto 20px auto;
	width: 400px;
	padding: 5px;
	background: var(--swp-color-surface);
	border: 1px solid #ccc;
	-moz-box-shadow: inset 0 0 5px #fff;
	-webkit-box-shadow: inset 0 0 5px #fff;
	box-shadow: inset 0 0 5px #fff;
}

.pagenavi a {
	padding: 5px 6px 4px 6px;
	margin: 3px;
	text-decoration: none;
	color: var(--swp-color-muted);
	background-color: inherit;
}

.pagenavi a:hover {
	color: #000;
}

.pagenavi span.pages {
	padding: 5px 6px 4px 6px;
	margin: 3px;
	color: var(--swp-color-text);
	font-weight: bold;
	background-color: inherit;
}

.pagenavi span.current {
	padding: 5px 6px 4px 6px;
	margin: 3px;
	font-weight: bold;
	color: var(--swp-color-white);
	background-color: #c5d0d8;
}

/* Comments are styled in assets/css/layout-extra.css. */

/* Typography Framework */
/* ---------------------------------------------------------- */


body {
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.description {
	color: var(--swp-color-muted);
}

.bread-crumb {
	color: var(--swp-color-muted);
	font-size: 12px;
	margin: 0px 0px 0px 0px;
	padding: 5px 5px 5px 10px;
}

.postdate {
	text-align: right;
	padding: 30px 20px 0px 0px;
}

.postmonth {
	color: #ccc;
	font-size: 11px;
	text-transform: uppercase;
	font-weight: bolder;
	padding: 0px;
	margin: 2px 0px 0px 0px;
}

.postyear {
	color: #ccc;
	font-weight: bolder;
	font-size: 22px;
	padding: 0px;
	margin: -2px 0px 0px 0px;
}

.content-format-aside .entry,
.content-format-gallery .entry,
.content-format-link .entry,
.content-format-image .entry,
.content-format-quote .entry,
.content-format-status .entry,
.content-format-video .entry,
.content-format-audio .entry,
.content-format-chat .entry {
	padding: 15px 0px 0px 0px;
}

.content-format-aside .entry {
	padding: 10px 0px 0px 0px;
}

.content-format-link p {
	font-size: 22px;
	padding: 0px 0px 0px 0px;
}

.content-format-link p:before {
	content: 'Link: ';
	margin: 0px;
	font-weight: 600;
}

.content-format-quote blockquote {
	font-size: 22px;
	padding: 20px 10px 20px 90px;
	margin: 0px;
	background: url("images/quotes.png") 10px 10px no-repeat #f3f3f3;
}

.content-format-status p:before {
	content: 'Status: ';
	margin: 0px;
	font-weight: 600;
}

.content-format-status p {
	font-size: 26px;
	margin: 0px;
	line-height: 32px;
}

.content-format-status .entry p {
	margin: 0px;
	padding: 0px 0px 0px 20px;
	text-align: left;
}

.content-format-status .entry img {
	float: left;
	text-align: center;
}

/* SWP does not use a separate visited-link color. */
a,
a:link {
	text-decoration: none;
	color: var(--swp-color-primary);
}

a:hover,
a:focus {
	text-decoration: none;
	color: var(--swp-color-primary-dark);
}

thead {
	display: table-header-group;
}

tr,
img {
	page-break-inside: avoid;
}

h2,
h3 {
	page-break-after: avoid;
}

p,
h2,
h3 {
	orphans: 3;
	widows: 3;
}

p {
	margin: 0 0 10px;
	line-height: 20px;
	font-size: 14px;
}

small {
	font-size: 85%;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

.left {
	text-align: left;
}

.right {
	text-align: right;
}

.center {
	text-align: center;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 10px 0;
	font-family: inherit;
	font-weight: bold;
	line-height: 20px;
	color: inherit;
	text-rendering: optimizelegibility;
}

h1,
h2,
h3 {
	line-height: 30px;
}

h1 {
}

h2 {
}

h3 {
}

h4 {
}

h5 {
}

h6 {
}

h1 small {
	font-size: 24.5px;
}

h2 small {
	font-size: 17.5px;
}

h3 small {
	font-size: 14px;
}

h4 small {
	font-size: 14px;
}

h1 a {
	text-decoration: none;
}

.headline {
	padding-bottom: 9px;
	margin: 20px 0 30px;
	border-bottom: 1px solid #eeeeee;
}

ul,
ol {
	font-size: 14px;
	color: var(--swp-color-text);
	padding: 0;
	margin: 0 0 10px 25px;
}

ul ul,
ul ol,
ol ol,
ol ul {
	margin-bottom: 0;
}

li {
	line-height: 20px;
}

dl {
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 20px;
}

dt,
dd {
	line-height: 20px;
}

dt {
	font-weight: bold;
	margin-top: 10px;
}

dd {
	margin: 5px 0px 0px 20px;
}

hr {
	margin: 20px 0;
	border: 0;
	border-top: 1px solid #eeeeee;
	border-bottom: 1px solid #ffffff;
}

abbr[title],
abbr[data-original-title] {
	cursor: help;
	border-bottom: 1px dotted #999999;
}

blockquote {
	font-size: 14px;
	line-height: 22px;
	background: var(--swp-color-surface);
	border-left: 10px solid #ccc;
	margin: 20px;
	quotes: "\201C""\201D""\2018""\2019";
	padding: 20px 10px 20px 90px;
	background: url("images/quotes.png") 10px 10px no-repeat #f3f3f3;
}

address {
	display: block;
	margin-bottom: 0px;
	font-style: normal;
	line-height: 20px;
}

code,
pre {
	padding: 0 3px 2px;
	font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
	font-size: 12px;
	color: var(--swp-color-text);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

code {
	padding: 2px 4px;
	color: #d14;
	background-color: var(--swp-color-surface);
	border: 1px solid #e1e1e8;
}

pre {
	display: block;
	padding: 9.5px;
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 20px;
	word-break: break-all;
	word-wrap: break-word;
	white-space: pre-wrap;
	background-color: var(--swp-color-surface);
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.15);
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

pre.prettyprint {
	margin-bottom: 20px;
}

pre code {
	padding: 0;
	color: inherit;
	white-space: pre;
	white-space: pre-wrap;
	background-color: transparent;
	border: 0;
}

.pre-scrollable {
	max-height: 340px;
	overflow-y: scroll;
}

table {
	max-width: 100%;
	background-color: transparent;
	border-collapse: collapse;
	border-spacing: 0;
	border: 1px solid #ccc;
}

tr,
td {
	border: 1px solid #ccc;
	padding: 5px;
}

th {
	padding: 5px;
	background-color: var(--swp-color-surface);
	border: 1px solid #ccc;
}

form {
	margin: 0 0 20px;
}

fieldset {
	padding: 0;
	margin: 0;
	border: 0;
}

legend {
	display: block;
	width: 100%;
	padding: 0;
	margin-bottom: 20px;
	font-size: 21px;
	line-height: 40px;
	color: var(--swp-color-text);
	border: 0;
	border-bottom: 1px solid #e5e5e5;
}

legend small {
	font-size: 15px;
	color: var(--swp-color-muted);
}

/* Legacy Bootstrap-era form/button rules removed in 2026.1.106.
 * Modern controls are defined centrally in assets/css/layout-extra.css.
 */


.button:focus {
	outline: thin dotted #333;
	outline: 5px auto -webkit-focus-ring-color;
	outline-offset: -2px;
}

/* ---------------- SWP Template Architecture ---------------- */
.swp-home-header {
    width: 100%;
    margin: 0;
}

.swp-home-header:empty {
    display: none;
}

.swp-splash-page,
.swp-splash-page #top,
.swp-splash {
    width: 100%;
    min-height: 100%;
}

.swp-splash {
    margin: 0;
    padding: 0;
}

.swp-bio-links__list {
    margin: 0;
    padding: 0;
    list-style: none;
}


/* ---------------- SWP Landing / Splash Page ---------------- */
body.swp-landing-page {
    min-height: 100vh;
    min-height: 100svh;
    margin: 0;
    overflow: hidden;
    background: #f7f7f7;
}

.swp-landing {
    position: relative;
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 2rem 1rem;
    box-sizing: border-box;
}

.swp-landing__background {
    position: absolute;
    inset: 0;
    background-color: var(--swp-color-surface);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transform: scale(1.01);
}

.swp-landing__background::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(20, 30, 38, .10);
    pointer-events: none;
}

.swp-landing__content {
    position: relative;
    z-index: 1;
    width: min(92vw, 820px);
    text-align: center;
    box-sizing: border-box;
    transform: translateY(-3vh);
}

.swp-landing__inner {
    display: inline-block;
    width: min(100%, 600px);
    padding: clamp(2rem, 4vw, 3rem);
    box-sizing: border-box;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 55px rgba(0, 0, 0, .18);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.swp-landing__inner h1 {
    margin: 0 0 1rem;
    font-size: clamp(2.5rem, 5vw, 3.5rem);
    line-height: 1.05;
}

.swp-landing__inner h1::after {
    content: "";
    display: block;
    width: 52px;
    height: 3px;
    margin: 1.15rem auto 0;
    background: var(--swp-color-primary, #155b8f);
}

.swp-landing__body {
    max-width: 480px;
    margin: 0 auto;
    font-size: 1.05rem;
    line-height: 1.65;
}

.swp-landing__body > :first-child {
    margin-top: 0;
}

.swp-landing__body > :last-child {
    margin-bottom: 0;
}


.swp-landing__inner--plain {
    width: auto;
    max-width: min(92vw, 720px);
    padding: 0;
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

.swp-landing__inner--plain h1,
.swp-landing__inner--plain .swp-landing__body {
    color: #fff;
    text-shadow: 0 2px 16px rgba(0, 0, 0, .58);
}

.swp-landing__inner--plain h1::after {
    background: rgba(255, 255, 255, .85);
}

.swp-landing__inner--plain .swp-landing__enter {
    box-shadow: 0 4px 18px rgba(0, 0, 0, .24);
}

.swp-landing__enter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 200px;
    min-height: 52px;
    margin-top: 2rem;
    padding: .8rem 1.75rem;
    box-sizing: border-box;
    text-decoration: none;
    font-weight: 600;
    background: #222;
    color: var(--swp-color-white);
    border: 1px solid #222;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.swp-landing__enter:hover,
.swp-landing__enter:focus {
    background: #000;
    border-color: #000;
    color: var(--swp-color-white);
    transform: translateY(-1px);
}

.swp-landing__enter:focus-visible {
    outline: 3px solid var(--swp-color-primary, #155b8f);
    outline-offset: 4px;
}

@media screen and (max-width: 782px) {
    .swp-landing {
        padding: 1rem;
    }

    .swp-landing__content {
        width: 100%;
        transform: none;
    }

    .swp-landing__inner {
        width: 100%;
        padding: 2rem 1.5rem;
    }

    .swp-landing__inner--plain {
        width: auto;
        max-width: 100%;
        padding: 0;
    }

    .swp-landing__inner h1 {
        font-size: clamp(2.25rem, 10vw, 3rem);
    }

    .swp-landing__enter {
        width: min(100%, 240px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .swp-landing__enter {
        transition: none;
    }

    .swp-landing__enter:hover,
    .swp-landing__enter:focus {
        transform: none;
    }
}