/*
 Theme Name:   N7 Golf Club Child Theme
 Theme URI:    https://golfclub.themerex.net
 Description:  N7 Golf Club Child Theme
 Author:       ThemeREX
 Author URI:   https://themerex.net
 Template:     n7-golf-club
 Version:      1.0.0
 Tags:         flexible-header, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, full-width-template, microformats, post-formats, theme-options, threaded-comments, translation-ready
 Text Domain:  n7-golf-club
*/


/* =Theme customization starts here
------------------------------------------------------------ */
/* ====== ITEM WRAPPER ====== */
.tournoi-item{
  position:relative;
  display:flex;
  /*grid-template-columns:28px 1fr;*/
  align-items:center;
  gap:12px;
  cursor:pointer;
  margin-bottom: 20px;
}

.tournoi-item .tournoi-checkbox{
  position:absolute; inset:0; opacity:0; pointer-events:none;
}

/* ====== VISUAL CHECKBOX ====== */
.tsel-check{
  width:30px; height:18px; margin:20px 0 0 6px;
  border:2px solid #C9C9C9; border-radius:4px; background:#fff;
  position:relative; box-shadow:0 0 0 2px #fff;
}
.tournoi-item .tournoi-checkbox:checked ~ .tsel-check{
  background:#9d1e23; border-color:#9d1e23;
}
.tournoi-item .tournoi-checkbox:checked ~ .tsel-check:after{
  content:""; position:absolute; left:4px; top:0px; width:6px; height:12px;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);
}

/* ====== CARD ====== */
.tournoi-card{
  display:grid;
  grid-template-columns:72px 180px 1fr;   /* rail | photo | info */
  gap:18px;
  /*background:#fff;*/
  /*border:1px solid #E9E9E9; border-radius:12px;*/
  padding:16px;
  transition:border-color .2s, box-shadow .2s, transform .1s;
  /*box-shadow:0 2px 0 rgba(0,0,0,.02);*/
}
.tournoi-item:hover .tournoi-card{ border-color:#D9D9D9; box-shadow:0 6px 18px rgba(0,0,0,.06); }
.tournoi-item .tournoi-checkbox:checked ~ .tournoi-card{ border-color:#0A7F2E; box-shadow:0 8px 22px rgba(10,127,46,.12); }

/*.tournoi-card::before{*/
/*  content:""; position:absolute; left:calc(72px + 180px + 28px);*/
/*  top:16px; bottom:16px; width:1px; background:#EFEFEF;*/
/*}*/
.tournoi-card{ position:relative; }

/* ====== RAIL (fix the tall white rounded bar) ====== */
.tournoi-rail{
  background:transparent !important;
  border:0 !important;
  border-right:1px solid #EFEFEF;
  border-radius:0 !important;
  box-shadow:none !important;
  width:72px; min-width:72px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding-right:10px;
}
.rail-step-num{ font-weight:800; color:#0A7F2E; font-size:18px; line-height:1; }
.rail-step-label{ margin-top:6px; font-size:12px; color:#8A8A8A; text-transform:uppercase; letter-spacing:.04em; }

/* ====== THUMB ====== */
.tournoi-thumb img{
  width:180px; height:110px; object-fit:cover; border-radius:8px;
}

/* ====== INFO ====== */
.tournoi-info{ display:grid; grid-auto-rows:min-content; gap:6px; }
.tournoi-title{ margin:0 0 2px; font-size:20px; line-height:1.2; text-transform:uppercase; color:#0F0F0F; letter-spacing:.02em; }

.tournoi-meta{ display:flex; flex-wrap:wrap; gap:14px; }
.meta{ display:inline-flex; align-items:center; gap:6px; color:black; font-size:13.5px; }
.ico{ fill:#c8a857; display:block; }

/* ====== PRICE ROW ====== */
.tournoi-price-row{ display:flex; align-items:baseline; gap:12px; margin-top:4px; flex-wrap:wrap; }
.price{ font-weight:800; color:#0A7F2E; font-size:18px; white-space:nowrap; } /* keeps 4 800 DH on one line */
.price-note{ font-size:12.5px; color:black; font-weight: 500;}

.tournoi-excerpt{ margin:4px 0 0; font-size:13.5px; color:#3D3D3D; }

.tsel-load-more{
      width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 45px;
    border: unset;
    border-radius: 8px;
    background: #fefefd;
    letter-spacing: 0.09em;
    font-weight: bold;
    color: #c8a857;
    transition: background .15s, border-color .15s, color .15s, transform .05s;
    margin-top: 14px;
    font-size: 14px;
}
.tsel-load-more:hover{
  background:#FBFDF9;
  border-color:#DEE8E1;
  color:#9d1e23;
}
.tsel-load-more.loading{ opacity:.6; pointer-events:none; }


.tournoi-acc-btn{
  display:block;
  width:80%;
  margin-top:10px;
  padding:5px 12px;            
  border:1px solid #EFEFEF;
  border-radius:8px;
  background:#fff;
  font-weight:600;
  text-align:center;
  color:#2b2b2b;
  cursor:pointer;
}
.tournoi-acc-btn:hover{ background:#FBFDF9; border-color:#DEE8E1; }
.tournoi-acc-btn[aria-expanded="true"]{ color:#0A7F2E; }

.tournoi-acc{
  display:block;
  overflow:hidden;
  max-height:0;                  
  padding:0;                     
  margin-top:8px;
  background:#F7F7F3;
  border-radius:8px;
  transition:max-height .30s ease, padding .25s ease;
}

.tournoi-acc.open{
  max-height:700px;               
  padding:12px 14px;
  }             

.tournoi-card.open .tournoi-rail {
  visibility: hidden;
}

/* ====== RESPONSIVE ====== */
@media (max-width: 780px){
  .tournoi-item{
    display: flex;
    /*grid-template-columns: 24px 1fr;*/
    align-items: center;
    gap: 10px;
  }

  .tsel-check{
    align-self: start;
    margin: 14px 0 0 0; 
  }

  .tournoi-card{
    grid-column: 2;                
    grid-template-columns: 52px 1fr;     
    grid-template-areas:
      "rail thumb"
      "rail title"
      "rail meta"
      "rail price";
    gap: 12px;
    padding: 14px;
  }

  .tournoi-card::before{ display: none; }

  .tournoi-rail{
    grid-area: rail;
    width: auto; min-width: auto;
    padding-right: 10px;
    border-right: 1px solid #EFEFEF;
    align-self: stretch;        
    justify-content: flex-start; 
  }

  .tournoi-thumb{ grid-area: thumb; }
  .tournoi-thumb img{
    width: 100%;
    height: 150px;
    border-radius: 8px;
    object-fit: cover;
  }

  .tournoi-info{ display: contents; }
  .tournoi-title{ grid-area: title; font-size: 18px; margin-top: 2px; }
  .tournoi-meta{ grid-area: meta; gap: 10px; }
  .tournoi-price-row{ grid-area: price; margin-top: 2px; }
  .price{ font-size: 17px; }
  .price-note{ font-size: 12px; }

  .tournoi-item{ margin-bottom: 18px; }
  
  
  .tournoi-acc-btn{
    grid-column: 1 / -1 !important;
    display: block !important;
    width: 100% !important;
    clear: both !important;
    float: none !important;
    box-sizing: border-box;
    margin-top: 10px;
  }

  .tournoi-acc{
    grid-column: 1 / -1 !important;
    display: block !important;
    width: 100% !important;
    clear: both !important;
    float: none !important;
    margin-top: 8px;
  }
  
  .tsel-check {
    width: 48px;
}

}