/**
 * Color classes and default styling are in /assets/main.css, focus your efforts there
 * @import external fonts at top of this page before default.css
 * remove comment for dark-mode.css if you want to enable that -- will not be 100%, you will need to fix minor things
 */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Yellowtail&display=swap');
@import url("./assets/default-settings.css");
/** @import url("assets/dark-mode.css"); */

body { font-size: 1.25rem; }
.yellowtail { font-family: "Yellowtail", cursive; font-weight: 400; font-style: normal; }
.display-4 { font-size: clamp( 2.75rem, calc( 2.75rem + (3.5rem - 2.75rem) * ( (100vw - 375px) / (1200px - 375px) ) ), 3.5rem ); font-weight: 500; }
.callout-title.display-5 { font-weight: 500 !important; }
.btn:hover, .btn:active, .btn:focus { text-decoration: underline; }
.card-footer .btn { margin-left: 0; }
.text-success { color: rgb(var(--bs-success-rgb)); }
#sidebar-default { background-color: #efefef; }
#sidebar-default form { margin-bottom: 1.5rem; }
#sidebar-default .wp-block-search__inside-wrapper { border-top: 0 none; border-right: 0 none; border-left: 0 none; }
#sidebar-default .wp-block-search__input { background: transparent; }
#sidebar-default .wp-element-button { border: 0 none; }
.wp-block-latest-posts__list li { margin-bottom: 1.25rem; }
.wp-block-latest-posts__list li a { font-weight: 600; }
.wp-block-latest-posts__list li a:hover { color: rgb(var(--bs-link-color-rgb)) !important; }

/** header */
#menu-shop-nav { list-style: none; margin: 0; padding: 9px 20px; }
#menu-shop-nav li { display: inline; text-align: center; }
#menu-shop-nav li a { display: inline; padding: 0 20px; text-decoration: none; text-transform: uppercase; color: rgb( var(--bs-dark-rgb) ); }
#menu-shop-nav li a:hover, #menu-shop-nav li a:active, #menu-shop-nav li a:focus  { text-decoration: underline; }
.navbar-brand { margin-bottom: 1rem; padding-top: 1rem; }
.navbar-brand img { max-width: 85%; }
.navbar-nav > .menu-item > .nav-link { font-size: 1.25rem; color: rgb( var(--bs-success-rgb) ); font-weight: 500; }

.post-header { background-color: rgb(var(--jwbs-heading-font-color)); }
.post-header.breakout h1 { margin-bottom: 0; }

/** carousel */
.carousel-caption { display: flex !important; flex-direction: column; justify-content: center; height: 100%; right: 15px; left: 15px; }

/** testimonial block */
#home-testimonials .card-img-overlay p { font-size: calc( var(--cw) / 15 ); }


/** modals */
.modal-dialog { max-width: 50%; font-size: 1rem; }
.modal-header { display: block; text-align: right; }
.modal-header .close { padding: 0; width: 2rem; height: 2rem; font-size: 42px; line-height: 16px; }
.modal-content figure { display: flex; align-items: center; }
.modal-content figcaption { margin-left: 1.25em; }

/** faq accordions */
#faqs { background: url('/wp-content/uploads/2025/04/crossed-paddles.png') no-repeat; background-size: 475px; background-position-x: -20px; background-position-y: calc(100% + 20px); }
.accordion-item { border-right-width: 0; border-left-width: 0; }
.accordion-button::after { position: absolute; left: 0.7rem; }
.accordion-button { padding-left: 2.5rem; font-size: 1.25rem; }
.accordion-body { font-size: 1.25rem; }

/** newsfeed */
.jwbs-newsfeed { font-size: 1.25rem; }
.jwbs-newsfeed .card { background-color: transparent; }
.jwbs-newsfeed .card-title { font-size: 1.9rem; }
.jwbs-newsfeed .card-title a { text-decoration: none; }
.jwbs-newsfeed .card-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.jwbs-newsfeed .btn { font-weight: 600; }
.home-newsfeed .card-body, .home-newsfeed .card-footer, .home-newsfeed .card-footer .btn { padding-left: 0; padding-right: 0; }
.home-newsfeed .card-footer .btn-link { color: rgb(var(--bs-success-rgb)); }

/* blog */
.single-post #content article { margin-top: 3rem; }
.single-post #content article section > .wp-post-image { margin-bottom: 3rem; }

/** footer */
#menu-footer { list-style: none; padding-inline-start: 0; margin: 10px 0; }
#menu-footer li { padding: 5px 10px; border-left: 1px solid #ffffff; }
#menu-footer li a { color: #ffffff; text-decoration: none; }

/** boostrap edits */
.btn { --bs-btn-border-radius: 0; }
.accordion, .accordion-item:first-of-type .accordion-button { --bs-accordion-border-radius: 0; --bs-accordion-inner-border-radius: 0; --bs-accordion-btn-icon-transform: rotate(-90deg); }
.accordion-button:not(.collapsed) { box-shadow: none; }
.accordion-button:focus { box-shadow: var(--bs-accordion-btn-focus-box-shadow); }
.accordion-body { padding: 0 2rem 1rem 4rem; }

/** media queries */
/** Small devices (landscape phones, 576px and up) [-sm] */
@media only screen and (min-width : 576px) {
  #paddle-image { background: url('/wp-content/uploads/2025/04/paddle-with-ball.png') no-repeat center right; background-size: contain; }
}

/** Medium devices (tablets, 768px and up) [-md] */
@media only screen and (min-width : 768px) {
  .carousel-caption { right: 15%; left: 15%; }
}

/** Large devices (desktops, 992px and up) [-lg] */
@media only screen and (min-width : 992px) {
	#founding-member.breakout { background: #d2d8e4 url('/wp-content/uploads/2025/05/memberships-Padel-Feb-24-24.jpg') no-repeat -40% center; }
  #menu-footer { margin: 0; }
  #menu-footer li { padding: 0 10px; display: inline-block; }
  #menu-footer li:first-of-type { border-left-width: 0; }
}

/** X-Large devices (large desktops, 1200px and up) [-xl] */
@media only screen and (min-width : 1200px) {
  :root { --bs-body-font-size: 1.5rem; }
}

/** larger desktops, 1400px and up [-xxl] */
@media only screen and (min-width : 1400px) {
}

@media only screen and (min-width : 1600px) {
	#founding-member.breakout { background-position: left center; }
}