/* =========================================================
   Let's Talk Styles
   ========================================================= */

#sectionLetsTalk {
  display: none;
  height: 100%;
}

#letsTalkContainer {
  display: flex;
  gap: 10px;
  height: calc(100% - 60px);
}

/* =========================================================
   Panel Layout
   ========================================================= */

#talkPanelContact {
  flex: 20;
}

#talkPanelProject {
  flex: 25;
}

#talkPanelQuestion {
  flex: 55;
}

.talk-panel {
  border: 1px solid #ccc;
  padding: 10px;
  overflow: auto;
}

/* =========================================================
   Contact & Project Panels
   ========================================================= */

#talkPanelContact,
#talkPanelProject {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

#talkPanelContact h3,
#talkPanelProject h3 {
  margin-top: 0;
}

#talkPanelContact label,
#talkPanelProject label {
  margin-top: 8px;
  font-weight: 600;
}

/* =========================================================
   Text Inputs & Selects
   ========================================================= */

#talkPanelContact input[type='text'],
#talkPanelContact input[type='email'],
#talkPanelContact select,
#talkPanelProject input[type='text'],
#talkPanelProject select {
  width: 100%;
  box-sizing: border-box;
}

/* =========================================================
   Checkboxes
   ========================================================= */

#talkPanelProject input[type='checkbox'] {
  width: auto;
}

.talk-checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  font-weight: normal !important;
}

.talk-checkbox input[type='checkbox'] {
  width: auto;
  margin: 0;
}

/* =========================================================
   Picture Controls
   ========================================================= */

.talk-picture-buttons {
  display: flex;
  gap: 5px;
  margin-top: 8px;
}

.talk-picture-buttons button {
  flex: 1;
}

#lstTalkPictures {
  height: 120px;
}

/* =========================================================
   Question Panel
   ========================================================= */

#talkPanelQuestion {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

#talkPanelQuestion h3 {
  margin-top: 0;
}

#talkPanelQuestion label {
  margin-top: 8px;
  font-weight: 600;
}

#talkPanelQuestion input[type='text'],
#talkPanelQuestion textarea {
  width: 100%;
  box-sizing: border-box;
}

#inpTalkQuestion {
  flex: 1;
  resize: vertical;
  min-height: 250px;
}

.talk-action-buttons {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

.talk-action-buttons button {
  min-width: 120px;
}