/* Front styles */
.saash-faq{border:1px solid #e5e7eb;background:#fff;border-radius:12px;margin:18px 0}
.saash-faq .af-title{font-weight:800;margin:12px 14px 6px;font-size:20px;line-height:1.35;color:#000}
.saash-faq .af-item{border-top:1px solid #eee}
.saash-faq .af-item:first-child{border-top:0}
.saash-faq .af-q{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:right;background:transparent;border:0;padding:16px 14px;font-size:17px;line-height:1.45;cursor:pointer;min-height:48px;color:#000}
.saash-faq .af-q:focus{outline:2px solid #000;outline-offset:2px}
.saash-faq .af-a{padding:0 14px 14px 14px;font-size:16px;line-height:1.7;color:#000}
.saash-faq .af-icon{margin-right:8px;font-weight:700;color:#000}

.expert-box-he{display:flex;gap:12px;align-items:flex-start;border:1px solid #e5e7eb;background:#fff;border-radius:14px;padding:14px;margin:18px 0}
.expert-box-he .eb-avatar{flex:0 0 72px}
.expert-box-he .eb-avatar img{width:72px;height:72px;border-radius:999px;object-fit:cover;display:block}
.expert-box-he .eb-content{flex:1 1 auto;color:#000}
.expert-box-he .eb-name{margin:0;font-size:18px;line-height:1.3;font-weight:800;color:#000}
.expert-box-he .eb-title{margin-top:2px;font-size:14px;color:#111}
.expert-box-he .eb-excerpt{margin-top:8px;font-size:15px;line-height:1.7;color:#000}
.expert-box-he .eb-sameas{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}


/* === ULTRA Additions === */
.saic-combo{direction:rtl; display:block; width:100%; max-width:100%; box-sizing:border-box; overflow-x:hidden;}
.saic-combo .saic-block{margin-bottom:var(--saic-gap,24px);}
.saic-combo.saic-layout-grid{display:grid; grid-template-columns:1fr; gap:var(--saic-gap,24px);}
@media(min-width:900px){
  .saic-combo.saic-layout-grid{grid-template-columns:1fr 1fr;}
  .saic-combo.saic-layout-grid .saic-faq{grid-column:1 / -1;}
}

/* Prevent long FAQ lines from breaking layout on mobile */
.saash-faq, .saash-faq *{box-sizing:border-box; max-width:100%;}
.saash-faq .af-q, .saash-faq .af-a, .saash-faq .af-title, .saash-faq .af-item{
  white-space:normal !important;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.saash-faq .af-q{display:flex; align-items:center; gap:.75rem;}
.saash-faq .af-icon{flex:0 0 20px; margin:0; width:20px; height:20px;}
@media (max-width:600px){
  .saash-faq{padding-inline:12px;}
}


/* == Mobile-perfect FAQ == */
.saash-faq, .saash-faq *{box-sizing:border-box; max-width:100%;}
.saash-faq .af-item{border-bottom:1px solid #eee;}
.saash-faq .af-q{display:flex;align-items:center;gap:12px;padding:14px 16px;}
.saash-faq .af-q > *{min-width:0;}
.saash-faq .af-q .af-title,.saash-faq .af-q .af-question,.saash-faq .af-q .af-text{flex:1 1 auto; overflow-wrap:anywhere; word-break:break-word; white-space:normal !important;}
.saash-faq .af-icon, .saash-faq i, .saash-faq svg{width:20px;height:20px;flex:0 0 20px;display:inline-block}
@media(max-width:600px){
  .saash-faq{padding-inline:12px}
  .saash-faq .af-q{padding:12px 12px}
}


/* == FAQ UX polish (Apple-like, RTL aware) == */
.saash-faq{direction:rtl}
.saash-faq .af-q{display:flex !important; align-items:flex-start !important; gap:12px; padding:14px 16px;}
.saash-faq .af-q > *{min-width:0}
.saash-faq .af-title{font-weight:800; letter-spacing:.2px; margin:0 16px 12px}
.saash-faq .af-icon{flex:0 0 20px; width:20px; height:20px; line-height:20px; text-align:center; margin-top:2px}
.saash-faq .af-q .af-title,.saash-faq .af-q .af-question,.saash-faq .af-q .af-text{flex:1 1 auto; overflow-wrap:anywhere; word-break:break-word; white-space:normal !important}
.saash-faq .af-a{padding:0 16px 14px}
@media(max-width:600px){ .saash-faq{padding-inline:12px} .saash-faq .af-q{padding:12px} }


/* === Expert box: mobile image on top === */
@media (max-width: 600px){
  .saicu-expert-inner{flex-direction:column; align-items:center; text-align:center;}
  .saicu-expert-box .saicu-meta{width:100%}
  .saicu-expert-box .saicu-avatar{width:96px; height:96px; margin-bottom:10px;}
  .saicu-expert-box .saicu-links, .saicu-expert-box .saicu-contact{text-align:center}
}

/* === FAQ: robust line-wrapping + mobile grid layout === */
.saash-faq, .saash-faq *{box-sizing:border-box; max-width:100%;}
.saash-faq .af-q{display:flex; align-items:flex-start; gap:12px; padding:14px 16px;}
.saash-faq .af-q > *{min-width:0}
.saash-faq .af-title, .saash-faq .af-question, .saash-faq .af-text{overflow-wrap:anywhere; word-break:break-word; white-space:normal !important;}
.saash-faq .af-icon, .saash-faq i, .saash-faq svg{flex:0 0 20px; width:20px; height:20px; line-height:20px; text-align:center}
@media (max-width: 600px){
  .saash-faq{padding-inline:12px}
  .saash-faq .af-q{display:grid !important; grid-template-columns:20px 1fr; align-items:start !important; padding:12px 12px;}
}


/* === Mobile single-column Expert box (plugin classes) === */
@media (max-width: 600px){
  .expert-box-he{flex-direction:column !important; align-items:center !important; text-align:center !important;}
  .expert-box-he .eb-avatar{order:-1; margin:0 0 10px 0 !important; flex:0 0 auto !important;}
  .expert-box-he .eb-content{width:100% !important;}
  .expert-box-he .eb-name,.expert-box-he .eb-title,.expert-box-he .eb-excerpt{margin-left:auto;margin-right:auto}
}

/* === Force FAQ questions to wrap on small screens === */
.saash-faq .af-q{white-space:normal !important;}
.saash-faq .af-question{display:block !important; white-space:normal !important; overflow-wrap:anywhere !important; word-break:break-word !important;}
@media (max-width: 600px){
  .saash-faq .af-q{display:grid !important; grid-template-columns:24px 1fr !important; align-items:start !important;}
  .saash-faq .af-icon{grid-column:1; grid-row:1;}
  .saash-faq .af-question{grid-column:2; grid-row:1;}
}


/* === Mobile Expert: single column centered (up to 820px) === */
@media (max-width: 820px){
  .saicu-expert-inner{flex-direction:column !important; align-items:center !important; text-align:center !important;}
  .saicu-expert-box .saicu-avatar{order:-1; margin:0 0 12px 0 !important; align-self:center !important; width:96px; height:96px;}
  .saicu-expert-box .saicu-links, .saicu-expert-box .saicu-contact{ text-align:center !important;}
  .expert-box-he{display:flex !important; flex-direction:column !important; align-items:center !important; text-align:center !important;}
  .expert-box-he .eb-avatar{order:-1 !important; margin:0 0 12px 0 !important; align-self:center !important; float:none !important;}
  .expert-box-he .eb-content{width:100% !important;}
}

/* === FAQ: guarantee wrapping for long questions === */
.saash-faq .af-q, .saash-faq .af-q *, .saash-faq .af-question, .saash-faq .af-title, .saash-faq .af-text{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  min-width:0 !important;
}
@media (max-width: 820px){
  .saash-faq .af-q{display:grid !important; grid-template-columns:24px 1fr !important; align-items:start !important; gap:12px !important;}
  .saash-faq .af-icon{grid-column:1; grid-row:1;}
  .saash-faq .af-question, .saash-faq .af-title, .saash-faq .af-text{grid-column:2; grid-row:1;}
}


/* === Admin social fields layout === */
.saash-socials{display:flex; flex-wrap:wrap; gap:8px}
.saash-socials label{display:flex; align-items:center; gap:6px}
.saash-socials input{max-width:280px}

/* === Expert: force no floats/two columns on mobile === */
@media (max-width: 820px){
  .expert-box-he{display:block !important; text-align:center !important;}
  .expert-box-he .eb-avatar{float:none !important; margin:0 auto 12px auto !important;}
  .expert-box-he .eb-content{float:none !important; width:100% !important;}
  .saicu-expert-inner{display:block !important; text-align:center !important;}
  .saicu-expert-box .saicu-avatar{margin:0 auto 12px auto !important;}
}

/* === FAQ: bulletproof wrapping + assign non-icon to second grid column === */
@media (max-width: 900px){
  .saash-faq .af-q{display:grid !important; grid-template-columns:24px 1fr !important; align-items:start !important; gap:12px !important;}
  .saash-faq .af-q > .af-icon{grid-column:1}
  .saash-faq .af-q > :not(.af-icon){grid-column:2; min-width:0 !important;}
}
.saash-faq .af-q, .saash-faq .af-q *{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}


/* === JS-assisted mobile one-column expert layout === */
.saash-mobile-onecol{ text-align:center !important; }
.saash-mobile-onecol .saicu-avatar,.saash-mobile-onecol .eb-avatar{ margin:0 auto 12px auto !important; float:none !important; }
.saash-mobile-onecol .saicu-meta,.saash-mobile-onecol .eb-content{ width:100% !important; text-align:center !important; }


/* === Ultimate mobile fix: avatar must be on top (CSS Grid) === */
@media (max-width: 900px){
  /* New markup (saicu-*) */
  .saicu-expert-box .saicu-expert-inner{display:grid !important; grid-template-columns:1fr !important; grid-auto-rows:auto !important; text-align:center !important;}
  .saicu-expert-box .saicu-avatar{grid-row:1 !important; justify-self:center !important; margin:0 0 12px 0 !important; float:none !important;}
  .saicu-expert-box .saicu-meta{grid-row:2 !important; width:100% !important;}
  /* Legacy markup (expert-box-he) */
  .expert-box-he{display:grid !important; grid-template-columns:1fr !important; text-align:center !important;}
  .expert-box-he .eb-avatar{grid-row:1 !important; justify-self:center !important; margin:0 0 12px 0 !important; float:none !important;}
  .expert-box-he .eb-content{grid-row:2 !important; width:100% !important;}
}