.elementor-1372 .elementor-element.elementor-element-475f125{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-1372 .elementor-element.elementor-element-475f125.e-con{--align-self:center;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1372 .elementor-element.elementor-element-2f24287{width:var( --container-widget-width, 100% );max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 24px;--container-widget-width:100%;--container-widget-flex-grow:0;text-align:center;}.elementor-1372 .elementor-element.elementor-element-2f24287.elementor-element{--align-self:center;}.elementor-1372 .elementor-element.elementor-element-2f24287 .elementor-heading-title{font-family:"Playfair Display", Sans-serif;font-size:65px;font-weight:800;color:var( --e-global-color-secondary );}.elementor-1372 .elementor-element.elementor-element-c34e787{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-1372 .elementor-element.elementor-element-acaf374{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1372 .elementor-element.elementor-element-acaf374.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1372 .elementor-element.elementor-element-cbfe4b9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1372 .elementor-element.elementor-element-cbfe4b9.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1372 .elementor-element.elementor-element-2fe1873{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1372 .elementor-element.elementor-element-2443f2c{--display:flex;}@media(min-width:768px){.elementor-1372 .elementor-element.elementor-element-acaf374{--width:18.03%;}.elementor-1372 .elementor-element.elementor-element-cbfe4b9{--width:65.758%;}.elementor-1372 .elementor-element.elementor-element-2fe1873{--width:20%;}}/* Start custom CSS for shortcode, class: .elementor-element-32cdc56 *//* =========================================================
   Al Muqadis — Site Reviews Custom Styling
   Paste this into: WP Admin > Appearance > Customize > 
   Additional CSS  (or your theme's custom CSS box)
   ========================================================= */

:root{
  --am-navy:        #16295a;   /* header/hero dark navy */
  --am-navy-light:  #1e3a73;   /* card background variant */
  --am-gold:        #d4a72c;   /* accent gold */
  --am-gold-dark:   #b8901f;   /* hover state gold */
  --am-white:       #ffffff;
  --am-text-dark:   #1a1a2e;
  --am-text-muted:  #5c6b8a;
  --am-heading-font: "Playfair Display", Georgia, serif;
  --am-body-font:    "Poppins", "Lato", sans-serif;
}

/* ---- Wrapper ---- */
.glsr-reviews{
  font-family: var(--am-body-font);
  color: var(--am-text-dark);
}

/* ---- Section title (if you show one) ---- */
.glsr-reviews h2,
.glsr-reviews h3{
  font-family: var(--am-heading-font);
  color: var(--am-navy);
  letter-spacing: 0.5px;
}

/* ---- Individual review card ---- */
.glsr-review{
  background: var(--am-white);
  border: 1px solid #e7e9f2;
  border-left: 4px solid var(--am-gold);
  border-radius: 10px;
  padding: 20px 22px;
  margin-bottom: 18px;
  box-shadow: 0 2px 10px rgba(22, 41, 90, 0.06);
  transition: transform .15s ease, box-shadow .15s ease;
}
.glsr-review:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(22, 41, 90, 0.12);
}

/* ---- Reviewer name ---- */
.glsr-review-author{
  font-family: var(--am-heading-font);
  font-weight: 700;
  color: var(--am-navy);
  font-size: 16px;
}

/* ---- Review date ---- */
.glsr-review-date{
  color: var(--am-text-muted);
  font-size: 13px;
}

/* ---- Star ratings (both display and form) ---- */
.glsr-star-rating .glsr-star,
.glsr-review-rating .glsr-star{
  color: var(--am-gold) !important;
}
.glsr-star-rating .glsr-star.glsr-hover,
.glsr-star-rating .glsr-star.glsr-selected{
  color: var(--am-gold-dark) !important;
}

/* ---- Review content text ---- */
.glsr-review-content{
  color: var(--am-text-dark);
  line-height: 1.6;
  margin-top: 8px;
}

/* ---- Review response (if client replies) ---- */
.glsr-review-response{
  background: #f5f7fc;
  border-left: 3px solid var(--am-navy);
  padding: 10px 14px;
  border-radius: 6px;
  margin-top: 10px;
  font-size: 14px;
}

/* =========================================================
   SUBMISSION FORM  [site_reviews_form]
   ========================================================= */
.glsr-form{
  background: var(--am-navy);
  border-radius: 12px;
  padding: 28px;
  color: var(--am-white);
}

.glsr-form label{
  font-family: var(--am-body-font);
  color: var(--am-white);
  font-weight: 500;
}

.glsr-form input[type="text"],
.glsr-form input[type="email"],
.glsr-form textarea{
  background: var(--am-white);
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 10px 12px;
  width: 100%;
  color: var(--am-text-dark);
}

.glsr-form input:focus,
.glsr-form textarea:focus{
  outline: none;
  border-color: var(--am-gold);
  box-shadow: 0 0 0 3px rgba(212, 167, 44, 0.25);
}

/* ---- Submit button ---- */
.glsr-form button[type="submit"],
.glsr-button{
  background: var(--am-gold);
  color: var(--am-navy);
  font-family: var(--am-body-font);
  font-weight: 600;
  border: none;
  border-radius: 6px;
  padding: 12px 28px;
  cursor: pointer;
  transition: background .15s ease;
}
.glsr-form button[type="submit"]:hover,
.glsr-button:hover{
  background: var(--am-gold-dark);
}

/* ---- Pagination / "load more" ---- */
.glsr-button-more{
  background: transparent;
  border: 1px solid var(--am-navy);
  color: var(--am-navy);
}
.glsr-button-more:hover{
  background: var(--am-navy);
  color: var(--am-white);
}/* End custom CSS */