/*
Theme Name: Phoenix Bar
Author: Sleeky
Author URI: https://sleeky.co.uk
Description: Phoenix Bar, Jesmond – built on A Sleeky Theme with the Cappa template. Pages are built from ACF flexible layouts; global settings live in Theme Options. Requires ACF PRO (or Secure Custom Fields).
Version: 1.0.0
Requires at least: 6.3
Requires PHP: 7.4
License: (c) Copyright of Sleeky. All Rights Reserved.
Text Domain: sleeky
*/

/*
 * Layout, typography and colours come from:
 *   css/plugins.css  – Bootstrap and the template's plugins
 *   css/cappa.css    – the Cappa template stylesheet (fonts swapped to Barlow Condensed, cream → off-white)
 *   css/phoenix.css  – Phoenix Bar brand overrides and sub-page styles
 * This file only adds WordPress-specific styles. The starter's default element styles are left out
 * because they clash with the Bootstrap grid the Cappa template is built on.
 */

/* WordPress core */
.alignleft { float: left; margin: 0 30px 20px 0; }
.alignright { float: right; margin: 0 0 20px 30px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text, .wp-element-caption { font-size: 14px; color: #666; margin-top: 8px; }
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}
.wp-block-table { margin: 0; }
blockquote {
	border-left: 4px solid var(--px-gold, #e0c889);
	margin: 30px 0;
	padding: 20px 25px;
	background: #f5f5f3;
}
img { height: auto; max-width: 100%; }

/* Logged-in admin bar sits above the fixed navbar */
.admin-bar .navbar { top: 32px; }
@media (max-width: 782px) { .admin-bar .navbar { top: 46px; } }

/* Text logo fallback (no logo set in Theme Options) */
.logo-wrapper .logo h2 { margin: 0; }

/* Page content (pages with body content, posts) */
.page-content, .post-content { color: #666; }
.page-content h2, .page-content h3, .post-content h2, .post-content h3 { margin: 30px 0 15px; text-transform: uppercase; font-weight: 600; }
.nav-solid main > .page-content:first-child { padding-top: 180px; }

/* Blog listing cards */
.post-card { background: #fff; border: 1px solid #e9e9e7; height: 100%; }
.post-card-img { display: block; overflow: hidden; }
.post-card-img img { transition: transform .5s; }
.post-card:hover .post-card-img img { transform: scale(1.05); }
.post-card-body { padding: 25px; }
.post-card-date { font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; color: #aa8453; }
.post-card-body h5 { font-size: 22px; font-weight: 600; text-transform: uppercase; margin: 8px 0 10px; }
.post-card-body h5 a { color: #222; }
.post-pagination { margin-top: 30px; }
.post-pagination .page-numbers { display: inline-block; padding: 6px 12px; border: 1px solid #e9e9e7; margin-right: 4px; color: #222; }
.post-pagination .page-numbers.current { background: var(--px-slate, #525258); color: #fff; border-color: var(--px-slate, #525258); }

/* Forms */
.contact__msg.alert-danger { color: #842029; background: #f8d7da; }
.contact__form button[disabled] { opacity: .6; }

/* Social feed shortcode wrapper */
.social-feed-shortcode { margin-top: 10px; }

/* Smash Balloon – keep the Follow / Load More buttons in the Phoenix style */
#sb_instagram .sbi_follow_btn a,
#sb_instagram #sbi_load .sbi_load_btn,
#sb_instagram .sbi_follow_btn a:focus,
#sb_instagram #sbi_load .sbi_load_btn:focus {
    background: transparent !important;
    color: #fff !important;
    border: 1px solid var(--px-gold, #e0c889) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 12px 30px !important;
    font-family: 'Barlow Condensed', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    line-height: 1.2 !important;
    transition: .4s !important;
}
#sb_instagram .sbi_follow_btn a:hover,
#sb_instagram #sbi_load .sbi_load_btn:hover {
    background: var(--px-gold, #e0c889) !important;
    color: #222 !important;
    box-shadow: none !important;
}
/* Instagram icon inside the button */
#sb_instagram .sbi_follow_btn a i,
#sb_instagram .sbi_follow_btn a svg {
    color: var(--px-gold, #e0c889) !important;
    fill: currentColor !important;
    margin-right: 8px !important;
    transition: .4s !important;
}
#sb_instagram .sbi_follow_btn a:hover i,
#sb_instagram .sbi_follow_btn a:hover svg {
    color: #222 !important;
}