/* ---------- Basic inputs in metabox ---------- */
.dtr-metabox input[type="text"],
.dtr-metabox input[type="number"]{
  width:100%;
  padding:6px;
  font-size:13px;
  box-sizing:border-box;
}
#dtr_calc_status{
  margin-left:10px;
  font-weight:600;
  color:green;
}
#dtr_calc_status.dtr-status-error{ color:#d54e21; }

/* ---------- Frontend: 4-column card grid using floats ---------- */
.dtr-card-grid{
  /* container for float children */
  overflow:hidden;
  zoom:1; /* hasLayout for old IE */
  margin: 0 -10px;
  padding: 0;
}

/* each card (horizontal row) */
.dtr-card-row{
  float:left;
  width:31%;
  margin:0 3.5% 20px 0; /* gap substitute */
  box-sizing:border-box;
  border:1px solid #ddd;
  border-radius:8px;
  padding:12px;
  background:#fff;
  min-height:100px;
}

/* remove right margin on every 4th item for perfect alignment */
.dtr-card-row:nth-child(4n){ margin-right:0; }

/* thumbnail (left) */
.dtr-thumb{
  float:left;
  width:100px;
  height:100px;
  overflow:hidden;
  border-radius:6px;
  margin-right:12px;
  background:#f8f8f8;
}
.dtr-thumb img{
  display:block;
  width:auto;
  height:100%;
  min-width:100%;
}

/* info area (right) */
.dtr-card-info{
  overflow:hidden; /* contains floats */
}
.dtr-card-info h3{
  margin:0 0 6px;
  font-size:15px;
  line-height:1.2;
}
.dtr-card-info p{
  margin:4px 0;
  font-size:13px;
}
.dtr-book-btn{
  display:inline-block;
  float:right; /* push to right inside info */
  margin-top:6px;
  padding:6px 12px;
  background:#fff;
  color:#eee !important;
  border: 1px solid #FF6210;
  border-radius:4px;
  font-size:13px;
  font-weight:600;
  text-decoration:none;
}
.dtr-book-btn:hover{ background:#135e96; }

/* clearfix after each card to ensure proper heights */
.dtr-card-row:after{
  content:"";
  display:block;
  clear:both;
}

/* ---------- Single Route (no flex) ---------- */
.dtr-single{
  background:#fff;
  padding:10px;
  border-radius:8px;
  border:1px solid #eee;
  box-shadow:0 2px 4px rgba(0,0,0,0.03);
  box-sizing:border-box;
}

/* header area: left block (info), right block (button) using floats */
.dtr-header{ overflow:hidden; margin-bottom:20px; zoom:1; }
.dtr-header-info{ float:left; width:68%; box-sizing:border-box;}
.dtr-header-btn{ float:right; width:30%; text-align:right; box-sizing:border-box; }

/* header content */
.dtr-header-info h1{ margin:0 0 10px; font-size:22px; }
.dtr-header-info p{ margin:4px 0; font-size:15px; }

/* button area center vertically by padding */
.dtr-header-btn .dtr-book-btn{
  display:inline-block;
  padding:10px 18px;
  margin-top:6px;
  border: 1px solid #ff6210;
  color:#333 !important;
  border-radius:4px;
  font-weight:700;
  text-decoration:none;
}
.dtr-header-btn .dtr-book-btn:hover{ background:#135e96; }

/* description */
.dtr-desc{ margin-top:20px; font-size:15px; line-height:1.6; margin-bottom:30px; }

/* ---------- Related Routes (5 columns fallback using floats) ---------- */
.dtr-related h3{ margin-bottom:15px; font-size:18px; }
.dtr-grid{ overflow:hidden; zoom:1; margin:0 -8px; }
.dtr-related-item{
  float:left;
  width:19%;
  margin:0 1% 15px;
  box-sizing:border-box;
  text-align:center;
  border:1px solid #f1f1f1;
  border-radius:6px;
  padding:8px;
  background:#fff;
}
.dtr-related-item img{ display:block; max-width:100%; height:auto; border-radius:4px; margin:0 auto 8px; }
.dtr-related-item h4{ font-size:14px; margin:0; }

/* clear floats */
.dtr-grid:after{ content:""; display:block; clear:both; }

/* ---------- Responsive breakpoints ---------- */
/* Tablet: 2 columns for main cards, 3 columns for related */
@media (max-width:1024px){
  .dtr-card-row{ width:48%; margin-right:4%; }
  .dtr-card-row:nth-child(2n){ margin-right:0; }
  .dtr-related-item{ width:31%; margin-right:3.5%; }
  .dtr-related-item:nth-child(3n){ margin-right:0; }
  .dtr-header-info{ width:60%; }
  .dtr-header-btn{ width:38%; }
}

/* Mobile: single column stack */
@media (max-width:600px){
  .dtr-card-row{ width:100%; margin-right:0; }
  .dtr-thumb{ width:60px; height:60px; }
  .dtr-thumb img{ height:100%; min-width:100%; }
  .dtr-related-item{ width:48%; margin-right:4%; }
  .dtr-related-item:nth-child(2n){ margin-right:0; }
  .dtr-header-info{ width:100%; float:none; }
  .dtr-header-btn{ width:100%; float:none; text-align:left; margin-top:12px; }
}

/* Small mobile: single related item per row */
@media (max-width:420px){
  .dtr-related-item{ width:100%; margin-right:0; }
}

.dtr-faq-section {
  margin:25px 0;
  padding:15px;
  background:#f9f9f9;
  border:1px solid #ddd;
  border-radius:6px;
}
.dtr-faq-section h3 { margin-top:0; font-size:18px; }
.dtr-faq-item { margin-bottom:10px; }
.dtr-faq-question {
  width:100%; text-align:left;
  background:#D3D3D3; border:1px solid #ccc;
  border-radius:4px; padding:10px;
  font-size:15px; font-weight:600; cursor:pointer; color:#000;
}
.dtr-faq-question[aria-expanded="true"] {
  background:#ff6210; color:#fff;
}
.dtr-faq-answer {
  padding:10px; border:1px solid #ccc;
  border-top:none; background:#fff;
}