/* EvanOne comments module styles (reference-like) */

.comment-form{margin-top: 10px;}
.comment-form p{margin:0;}
.comment-form .comment-form-author,
.comment-form .comment-form-email,
.comment-form .comment-form-url,
.comment-form .comment-form-comment{margin:0;}

.comment-form label{letter-spacing:normal;word-spacing:normal;text-align:left;}

.evanone-comment-form{margin-top: 10px;}

.evanone-comment-form-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin: 0 0 10px;
}
.evanone-comment-form-title{font-weight: 700;color: var(--black);}
.evanone-comment-form-title::before{content:"/";color: var(--blockquote-color);margin-right:6px;}

.evanone-comment-form-row{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  max-width: 94%;
  margin: 0 auto;
}
@media (max-width: 900px){
  .evanone-comment-form-row{grid-template-columns:1fr;max-width:100%;}
}

.evanone-field{display:block;min-width:0;}
.evanone-label{
  display:flex;
  align-items:center;
  gap:6px;
  font-size: 12px;
  color: var(--gray-color);
  margin-bottom: 6px;
}
.evanone-label em{font-style:normal;color:#c0392b;}

.evanone-field input{
  display:block;
  width:100%;
  padding: 10px 12px;
  background: var(--friend-color);
  border: 1px solid var(--friend-border);
  border-radius: 10px;
  font-size: 13px;
}

.evanone-comment-form-text{margin-top: 14px; max-width:94%; margin-left:auto; margin-right:auto;}
.evanone-comment-form-text textarea{
  display:block;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  min-height: 220px;
  padding: 12px 12px;
  background: #fff;
  border: 1px solid var(--friend-border);
  border-radius: 12px;
  font-size: 13px;
  resize: vertical;
}

.evanone-comment-form-foot{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 12px;
  margin-top: 10px;
  max-width: 94%;
  margin-left: auto;
  margin-right: auto;
}
.evanone-comment-form-foot-left{min-width:0;}
.evanone-comment-form-foot-right{flex:0 0 auto; display:flex; align-items:center;}

.evanone-comment-save{
  display:flex;
  align-items:center;
  gap: 8px;
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--gray-color);
}
.evanone-comment-save input{margin:0; flex:0 0 auto;}
.evanone-comment-save span{display:block; min-width:0;}

.comment-form .submit{
  background-color: rgba(0,0,0,0.0);
  color: var(--black);
  border: 1px solid var(--friend-border);
  border-radius: 10px;
  padding: 8px 14px;
  font-size: 13px;
  transition: all 0.2s ease;
}
.comment-form .submit:hover{
  background-color: var(--black);
  color: var(--background-color);
  border-color: var(--black);
}

/* cookies consent (default WP field suppressed; kept for safety if plugins re-add it) */
.comment-form-cookies-consent{
  display:flex;
  align-items:flex-start;
  gap: 8px;
  margin-top: 10px;
}
.comment-form-cookies-consent input{margin-top: 3px;flex:0 0 auto;}
.comment-form-cookies-consent label{margin:0;}

/* Keep existing compact comment list (no grey background) */
.evanone-comment-card{background:transparent;border:1px solid var(--friend-border);border-radius:14px;padding:10px 12px;}

/* Prevent mobile overflow */
.evanone-comment-form, .evanone-comment-form *{box-sizing:border-box;}
.comment-form{overflow-x:hidden;}

/* ===== Mobile optimization (do not affect desktop) ===== */
@media (max-width: 600px){
  .evanone-comment-form-head{margin-bottom:8px;}
  .evanone-comment-form-title{font-size: 14px;}

  .evanone-comment-form-row{gap:10px;max-width:100%;margin:0;}
  .evanone-label{font-size:12px;margin-bottom:5px;}

  .evanone-field input{padding:9px 10px;border-radius:10px;}

  .evanone-comment-form-text{margin-top:12px; max-width:100%; margin-left:0; margin-right:0;}
  .evanone-comment-form-text textarea{min-height:160px;padding:10px 10px;border-radius:12px;width:100%;max-width:100%;}

  .comment-form-cookies-consent{gap:8px;margin-top:10px;line-height:1.5;}
  .comment-form-cookies-consent label{font-size:12px;}

  .evanone-comment-form-foot{margin-top:10px; max-width:100%; margin-left:0; margin-right:0; flex-wrap:wrap;}
  .evanone-comment-save{font-size:12px;}
  .comment-form .submit{width:auto; padding:8px 12px;}

  .evanone-comment-card{padding:10px 12px;}
}

@media (max-width: 380px){
  .evanone-comment-form-row{gap:8px;}
  .evanone-field input{font-size:13px;}
  .comment-form .submit{font-size:13px;}
}