/*
	Theme Name: Rehub child theme
	Theme URI: https://wpsoul.com
	Description: A Hybrid magazine/shop/review/news Wordpress Theme
	Author: Sizam
	Author URI: https://wpsoul.com
	Version: 9.4
	Template: rehub-theme
*/

/* =Theme customization starts here
-------------------------------------------------------------- */
/* ===== Rehub archive/category cards: remove thumbnail column + reclaim width ===== */

/* 1) Hide the thumbnail wrapper completely */
body.archive .rh_grid_image_wrapper .newsimage,
body.archive .rh_grid_image_wrapper .rh_gr_img,
body.archive .rh_grid_image_wrapper .newsimage figure,
body.archive .rh_grid_image_wrapper .newsimage img {
  display: none !important;
}

/* 2) Force the wrapper to a single column (prevents reserved space on the left) */
body.archive .rh_grid_image_wrapper {
  display: grid !important;
  grid-template-columns: 1fr !important;
  column-gap: 0 !important;
  padding-left: 0 !important;   /* kill theme padding used for the image lane */
}

/* Make every right-side section span the full width */
body.archive .rh_grid_image_wrapper > .newsdetail {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  width: 100% !important;
  min-height: 0 !important;     /* in case theme sets min-height to match thumb */
}

/* Target specific right-side blocks too (belt-and-suspenders) */
body.archive .rh_grid_image_wrapper .rh_gr_right_sec,
body.archive .rh_grid_image_wrapper .rh_gr_right_desc,
body.archive .rh_grid_image_wrapper .rh_gr_right_btn {
  margin-left: 0 !important;
  padding-left: 0 !important;
  width: 100% !important;
  float: none !important;
}

/* Optional: tighten outer card spacing after removing the image lane */
body.archive .rh_grid_image_wrapper { row-gap: 8px !important; }



/* Remove thumbnail lane on list cards across archives, blog, home, search */
body.archive .rh_grid_image_wrapper .newsimage,
body.blog    .rh_grid_image_wrapper .newsimage,
body.home    .rh_grid_image_wrapper .newsimage,
body.search  .rh_grid_image_wrapper .newsimage,
body.archive .rh_grid_image_wrapper .rh_gr_img,
body.blog    .rh_grid_image_wrapper .rh_gr_img,
body.home    .rh_grid_image_wrapper .rh_gr_img,
body.search  .rh_grid_image_wrapper .rh_gr_img,
body.archive .rh_grid_image_wrapper .newsimage figure,
body.blog    .rh_grid_image_wrapper .newsimage figure,
body.home    .rh_grid_image_wrapper .newsimage figure,
body.search  .rh_grid_image_wrapper .newsimage figure,
body.archive .rh_grid_image_wrapper .newsimage img,
body.blog    .rh_grid_image_wrapper .newsimage img,
body.home    .rh_grid_image_wrapper .newsimage img,
body.search  .rh_grid_image_wrapper .newsimage img {
  display: none !important;
}

/* Reclaim full width: kill the reserved padding/column and any left margin */
body.archive .rh_grid_image_wrapper,
body.blog    .rh_grid_image_wrapper,
body.home    .rh_grid_image_wrapper,
body.search  .rh_grid_image_wrapper {
  display: block !important;
  padding-left: 0 !important;      /* some layouts pad for the image lane */
}

/* Some Rehub layouts set margin-left on the right column—zero it out */
body.archive .rh_grid_image_wrapper .newsdetail,
body.blog    .rh_grid_image_wrapper .newsdetail,
body.home    .rh_grid_image_wrapper .newsdetail,
body.search  .rh_grid_image_wrapper .newsdetail,
body.archive .rh_grid_image_wrapper .rh_gr_right_sec,
body.blog    .rh_grid_image_wrapper .rh_gr_right_sec,
body.home    .rh_grid_image_wrapper .rh_gr_right_sec,
body.search  .rh_grid_image_wrapper .rh_gr_right_sec,
body.archive .rh_grid_image_wrapper .rh_gr_right_desc,
body.blog    .rh_grid_image_wrapper .rh_gr_right_desc,
body.home    .rh_grid_image_wrapper .rh_gr_right_desc,
body.search  .rh_grid_image_wrapper .rh_gr_right_desc,
body.archive .rh_grid_image_wrapper .rh_gr_right_btn,
body.blog    .rh_grid_image_wrapper .rh_gr_right_btn,
body.home    .rh_grid_image_wrapper .rh_gr_right_btn,
body.search  .rh_grid_image_wrapper .rh_gr_right_btn {
  margin-left: 0 !important;
  padding-left: 0 !important;
  width: 100% !important;
  float: none !important;
  min-height: 0 !important;        /* avoids matching old thumbnail height */
}

/* Optional: tighten inner spacing now that it's single-column */
body.archive .rh_grid_image_wrapper,
body.blog    .rh_grid_image_wrapper,
body.home    .rh_grid_image_wrapper,
body.search  .rh_grid_image_wrapper {
  row-gap: 8px !important;
}

/* ===== Kill image lane + reclaim width on mobile/tablet ===== */
@media (max-width: 900px) {

  /* Hide the image block everywhere it appears */
  body.blog    .rh_grid_image_wrapper .newsimage,
  body.archive .rh_grid_image_wrapper .newsimage,
  body.category .rh_grid_image_wrapper .newsimage,
  body.home    .rh_grid_image_wrapper .newsimage,
  body.search  .rh_grid_image_wrapper .newsimage,
  .rh_grid_image_wrapper .rh_gr_img,
  .rh_grid_image_wrapper .newsimage figure,
  .rh_grid_image_wrapper .newsimage img {
    display: none !important;
  }

  /* Remove any left padding/gutter reserved for the image lane */
  .rh_grid_image_wrapper {
    padding-left: 0 !important;
  }

  /* Sibling rules like ".newsimage + .newsdetail { margin-left: X }" — neutralize them */
  .rh_grid_image_wrapper .newsimage + .newsdetail,
  .rh_grid_image_wrapper .newsimage + .rh_gr_right_sec,
  .rh_grid_image_wrapper .newsimage + .rh_gr_right_desc,
  .rh_grid_image_wrapper .newsimage + .rh_gr_right_btn {
    margin-left: 0 !important;
  }

  /* Force the right column to become full-width, no floats/min-heights */
  .rh_grid_image_wrapper .newsdetail,
  .rh_grid_image_wrapper .rh_gr_right_sec,
  .rh_grid_image_wrapper .rh_gr_right_desc,
  .rh_grid_image_wrapper .rh_gr_right_btn,
  .rh_grid_image_wrapper .newstitleblock {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    min-height: 0 !important;
  }
}

/* ==== Kill the left thumbnail lane on mobile/tablet (Rehub list cards) ==== */
@media (max-width: 900px) {

  /* 1) Hide the image completely */
  .rh_grid_image_wrapper .newsimage,
  .rh_grid_image_wrapper .rh_gr_img,
  .rh_grid_image_wrapper .newsimage figure,
  .rh_grid_image_wrapper .newsimage img {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  /* 2) Remove the reserved gutter from the wrapper itself */
  .rh_grid_image_wrapper {
    padding-left: 0 !important;
    margin-left: 0 !important;
    min-height: 0 !important;
    display: block !important;
  }

  /* 3) Neutralize sibling rules like ".newsimage + .newsdetail { margin-left: X }" */
  .rh_grid_image_wrapper .newsimage + .newsdetail,
  .rh_grid_image_wrapper .newsimage + .rh_gr_right_sec,
  .rh_grid_image_wrapper .newsimage + .rh_gr_right_desc,
  .rh_grid_image_wrapper .newsimage + .rh_gr_right_btn {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  /* 4) Force every right-side block to be full width with no floats/min-heights */
  .rh_grid_image_wrapper .newsdetail,
  .rh_grid_image_wrapper .newstitleblock,
  .rh_grid_image_wrapper .rh_gr_right_sec,
  .rh_grid_image_wrapper .rh_gr_right_desc,
  .rh_grid_image_wrapper .rh_gr_right_btn {
    width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    min-height: 0 !important;
  }

  /* 5) Extra belt-and-suspenders: zero any margin on common list wrappers */
  .newsflow .newsdetail,
  .postlist .newsdetail {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
}

/* scope it so we don't touch other forms */
#circle-calc { --field-h: 42px; --gap: 10px; }

/* two columns: Diameter | Radius */
#circle-calc .fields-row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 30px;
  align-items:start;
}

#circle-calc .re-form-group > label{
  display:block;
  margin:0 0 6px;
  font-weight:600;
}

/* value + unit inline and vertically centered */
#circle-calc .input-with-unit{
  display:flex;
  align-items:center;
  gap: var(--gap);
}

/* make inputs/selects the same height and stop clipping */
#circle-calc input[type="text"],
#circle-calc input[type="number"],
#circle-calc select{
  height: var(--field-h);
  line-height: 1.25;           /* fixes text cut-off */
  padding: 8px 12px;
  font-size: 16px;
  box-sizing: border-box;
}

/* keep unit select compact (theme sets selects to width:100%) */
#circle-calc .input-with-unit select{
  min-width: 70px;
  width: auto !important;
  flex: 0 0 auto;
}

/* let the numeric field stretch */
#circle-calc .input-with-unit input{
  flex: 1 1 auto;
}

/* (Optional) if Safari still clips text in controls, uncomment:
#circle-calc input, #circle-calc select{ -webkit-appearance:none; appearance:none; }
*/


/* --- Circle calc: fix clipping + alignment --- */
#circle-calc{
  --min-h: 44px;   /* tweak to taste (40–46px works well) */
  --pv: 10px;      /* vertical padding */
  --ph: 12px;      /* horizontal padding */
  --gap: 10px;
}

#circle-calc .input-with-unit{
  display:flex;
  align-items:center;
  gap: var(--gap);
}

/* Let padding define height; kill theme's fixed heights */
#circle-calc input[type="text"],
#circle-calc input[type="number"],
#circle-calc select{
  font-size: 16px;
  line-height: normal !important;   /* prevents ascender/descender clipping */
  height: auto !important;          /* override theme's fixed height */
  min-height: var(--min-h);
  padding: var(--pv) var(--ph);
  box-sizing: border-box;
  vertical-align: middle;
}

/* Keep the unit dropdown compact and aligned */
#circle-calc .input-with-unit select{
  width: auto !important;
  min-width: 70px;
  flex: 0 0 auto;
}

/* Let the numeric input stretch */
#circle-calc .input-with-unit input{
  flex: 1 1 auto;
}

/* Normalize number inputs (stops odd baselines/clipping on some skins) */
#circle-calc input[type="number"]{
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
#circle-calc input[type="number"]::-webkit-outer-spin-button,
#circle-calc input[type="number"]::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}

/* If your theme sets overflow on inputs, unclip the text */
#circle-calc input, 
#circle-calc select{
  overflow: visible !important;
}




















