/*
Theme Name: YourCooper Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: yourcooper
Version: 1.0
*/

/* grid */
.assemblies-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:24px;
}
.assembly-card{
  background:#fff;
  border-radius:18px;
  box-shadow:0 6px 20px rgba(0,0,0,.08);
  overflow:hidden;
}
.assembly-card__thumb{ position:relative; aspect-ratio:16/9; background:#f4f4f4; }
.assembly-card__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.assembly-card__avatar{
  position:absolute; left:18px; bottom:-28px; width:72px; height:72px; border-radius:50%;
  border:6px solid #fff; object-fit:cover; background:#fff;
}
.assembly-card__play{
  position:absolute; inset:0; margin:auto; width:76px; height:76px; border-radius:50%;
  background:#fff; box-shadow:0 6px 16px rgba(0,0,0,.15); object-fit:contain; padding:14px;
}
.assembly-card__play.default:before{
  content:""; position:absolute; left:30px; top:24px; border-left:18px solid #ff6b3d;
  border-top:12px solid transparent; border-bottom:12px solid transparent;
}
.assembly-card__body{ padding:42px 22px 24px; }
.assembly-card__subtitle{ font-weight:700; font-size:14px; color:#333; margin-bottom:8px; }
.assembly-card__title{ font-size:28px; line-height:1.2; margin:0 0 16px; }
.assembly-card__cta .btn-watch{
  display:inline-flex; align-items:center; gap:8px; font-weight:700;
  color:#ff6b3d; background:transparent; border:none; cursor:pointer; padding:8px 0;
}
.assembly-card__cta .btn-watch::before{
  content:""; width:14px; height:14px; border:2px solid currentColor; border-radius:3px;
  border-left-color:transparent; transform:rotate(45deg);
}

/* modal */
.assembly-modal{ position:fixed; inset:0; z-index:9999; display:none; }
.assembly-modal.is-open{ display:block; }
.assembly-modal__overlay{ position:absolute; inset:0; background:rgba(0,0,0,.5); }
.assembly-modal__dialog{
  position:relative; margin:4vh auto; max-width:880px; background:#fff; border-radius:18px; overflow:hidden;
  box-shadow:0 12px 40px rgba(0,0,0,.25); z-index:1;
}
.assembly-modal__close{
  position:absolute; right:16px; top:12px; width:36px; height:36px; border-radius:50%; border:0; background:#fff; cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.15); font-size:22px; line-height:36px;
}
.assembly-modal__header{ position:relative; aspect-ratio:16/6.5; background:#f4f4f4; }
.assembly-modal__header .header__cover{ width:100%; height:100%; object-fit:cover; display:block; }
.assembly-modal__header .header__avatar{
  position:absolute; left:24px; top:24px; width:74px; height:74px; border-radius:50%; border:6px solid #fff; object-fit:cover;
}
.assembly-modal__header .header__play{
  position:absolute; inset:0; margin:auto; width:92px; height:92px; border-radius:50%; background:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.2);
}
.assembly-modal__header .header__play::after{
  content:""; position:absolute; left:38px; top:30px; border-left:22px solid #ff6b3d;
  border-top:14px solid transparent; border-bottom:14px solid transparent;
}
.assembly-modal__header .header__brand{
  position:absolute; left:120px; top:28px; background:#ffefaf; padding:10px 14px; border-radius:22px;
  font-weight:800; font-size:14px;
}

.assembly-modal__content{ padding:24px 28px; }
.assembly-modal__content h2{ margin:0 0 12px; font-size:32px; }
.assembly-modal__content .desc{ color:#333; line-height:1.6; }
.assembly-modal__content .sep{ margin:22px 0; border:none; border-top:1px solid #e8e8e8; }
.assembly-modal__content .facts{ display:flex; gap:28px; }
.assembly-modal__content .facts span{ color:#666; font-size:13px; display:block; }
.assembly-modal__content .facts strong{ font-size:16px; }

.assembly-modal__footer{
  display:flex; justify-content:flex-end; gap:12px; padding:16px 24px 22px; border-top:1px solid #eee;
}
.btn-watch.large{
  display:inline-flex; align-items:center; gap:8px; padding:12px 18px; border-radius:28px; background:#fff4ef; color:#ff6b3d; font-weight:800; text-decoration:none;
}
.btn-share{
  width:42px; height:42px; border-radius:50%; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.15);
  display:inline-block; position:relative; text-decoration:none;
}
.btn-share:after{
  content:""; position:absolute; inset:0; margin:auto; width:18px; height:18px;
  border:2px solid #333; border-top-color:transparent; transform:rotate(45deg); border-radius:4px;
}

/* responsive tweaks */
@media (max-width: 720px){
  .assembly-card__title{ font-size:22px; }
  .assembly-modal__dialog{ margin:2vh 10px; }
  .assembly-modal__content h2{ font-size:26px; }
  .assembly-modal__content .facts{ flex-direction:column; gap:10px; }
}

/* Article Single Post Custom Styles */
.row.featured-media-under-header {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
}

.featured-media-under-header__content {
  text-align: center !important;
  max-width: 100% !important;
  width: 100% !important;
  order: 1 !important;
}

.featured-media-under-header__content > * {
  text-align: center !important;
}

.featured-media-under-header__featured-media {
  width: 100% !important;
  margin-top: 24px !important;
  order: 2 !important;
  display: block !important;
}

.article-breadcrumb {
  margin-bottom: 16px !important;
  font-size: 14px !important;
  color: #F16634 !important;
  text-align: center !important;
}

.article-breadcrumb a {
  color: #F16634 !important;
  text-decoration: none !important;
}

.article-breadcrumb a:hover {
  text-decoration: underline !important;
}

.article-breadcrumb span {
  margin: 0 8px !important;
}

.featured-media-under-header__topic-wrap {
  margin-bottom: 16px !important;
  text-align: center !important;
}

.featured-media-under-header__topic-wrap .meta-topic {
  display: inline-block !important;
  padding: 4px 16px !important;
  border: none !important;
  border-radius: 20px !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  background: transparent !important;
  color: #000 !important;
}

.featured-media-under-header .entry-title {
  text-align: center !important;
  margin-bottom: 16px !important;
}

.featured-media-under-header__meta-wrap {
  text-align: center !important;
  margin-bottom: 16px !important;
}

.featured-media-under-header__tags-wrap {
  text-align: center !important;
  margin-bottom: 24px !important;
}

.featured-media-under-header__tags-wrap .article-tag {
  display: inline-block !important;
  padding: 6px 16px !important;
  background-color: #F16634 !important;
  color: #fff !important;
  border-radius: 20px !important;
  font-size: 14px !important;
  margin-right: 8px !important;
  margin-bottom: 8px !important;
  font-weight: 500 !important;
  border: none !important;
}

.featured-media-under-header__excerpt {
  text-align: center !important;
  margin-bottom: 24px !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: #333 !important;
  margin-top: 0 !important;
}

/* Onboarding Steps */
.steps{
  display:flex;
  gap:16px;
}

/* base */
.step-pill{
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 22px;
  border-radius:18px;
  min-width:280px;
}

/* disabled steps (1-2) */
.step-pill.is-disabled{
  background:#f6d8de;
}

.step-pill.is-disabled .step-number{
  background:#fff;
  color:#999;
}

.step-pill.is-disabled .step-text{
  color:rgba(0,0,0,0.4);
  font-weight:600;
}

/* active step (3) */
.step-pill.is-active{
  background:#fff;
}

.step-pill.is-active .step-number{
  width:44px;
  height:44px;
  border-radius:999px;
  background:#2e7d32;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
}

.step-pill.is-active .step-text{
  color:#111;
  font-weight:700;
  font-size:18px;
}

/* shared number style */
.step-number{
  width:44px;
  height:44px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  flex:0 0 44px;
}

.step-text{
  font-size:16px;
}

.cooper-booking-title {
    font-size: 32px;
    font-weight: 700;
    color: #2a2a2a;
    margin: 0 0 16px 0;
    line-height: 1.2;
}
