/* Molle Business Platform — Public styles (uses central theme variables) */
.molle-hidden { display: none !important; }

body.molle-page {
  background: var(--molle-page-bg, #f4f1ea);
  color: var(--molle-text, #2c2c2c);
}

.molle-card {
  background: var(--molle-surface, #ffffff);
  border-radius: var(--molle-radius, 12px);
  padding: 32px;
  box-shadow: var(--molle-shadow, 0 2px 8px rgba(0,0,0,0.08));
  margin-bottom: 24px;
}

.molle-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--molle-primary, #3a6b5e);
  margin: 0 0 8px;
}

.molle-subtitle {
  color: var(--molle-text-muted, #6b6b6b);
  margin: 0 0 24px;
  font-size: 16px;
}

.molle-form { display: flex; flex-direction: column; gap: 16px; }

.molle-field { display: flex; flex-direction: column; gap: 6px; }
.molle-field label { font-weight: 600; font-size: 14px; color: var(--molle-text, #2c2c2c); }
.molle-field input,
.molle-field select,
.molle-field textarea {
  padding: 14px 16px;
  border: 2px solid var(--molle-input-border, #c9c3b5);
  border-radius: var(--molle-radius, 12px);
  font-size: 16px;
  background: var(--molle-input-bg, #ffffff);
  color: var(--molle-text, #2c2c2c);
  transition: border-color 0.2s, box-shadow 0.2s;
  width: 100%;
  box-sizing: border-box;
}
.molle-field input:focus,
.molle-field select:focus,
.molle-field textarea:focus {
  outline: none;
  border-color: var(--molle-primary, #3a6b5e);
  box-shadow: 0 0 0 3px rgba(58,107,94,0.12);
}

.molle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border: none;
  border-radius: var(--molle-radius, 12px);
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s, transform 0.1s, box-shadow 0.2s;
  min-height: 48px;
}
.molle-btn:active { transform: scale(0.98); }
.molle-btn-primary { background: var(--molle-primary, #3a6b5e); color: var(--molle-primary-text, #ffffff); }
.molle-btn-primary:hover { opacity: 0.88; box-shadow: var(--molle-shadow, 0 2px 8px rgba(0,0,0,0.08)); }
.molle-btn-secondary { background: var(--molle-surface, #ffffff); color: var(--molle-primary, #3a6b5e); border: 2px solid var(--molle-primary, #3a6b5e); }
.molle-btn-secondary:hover { background: var(--molle-surface-alt, #f0ece2); }
.molle-btn-link { background: transparent; color: var(--molle-primary, #3a6b5e); padding: 8px; text-decoration: underline; min-height: auto; }

.molle-message {
  font-size: 14px;
  min-height: 20px;
  margin: 0;
}
.molle-message.molle-success { color: var(--molle-success, #3a7d4f); }
.molle-message.molle-error { color: var(--molle-danger, #b04a3a); }

.molle-login-container {
  max-width: 480px;
  margin: 40px auto;
  padding: 0 16px;
}

.molle-logged-in,
.molle-login-required {
  text-align: center;
  padding: 48px 24px;
}

.molle-placeholder {
  color: var(--molle-text-muted, #6b6b6b);
  font-style: italic;
}

/* Guide profile */
.molle-guide-profile { max-width: 800px; margin: 0 auto; }
.molle-guide-cover {
  height: 240px;
  background-size: cover;
  background-position: center;
  border-radius: var(--molle-radius, 12px);
  margin-bottom: -48px;
}
.molle-guide-main { padding: 0 16px; }
.molle-guide-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}
.molle-guide-logo {
  width: 80px;
  height: 80px;
  border-radius: var(--molle-radius, 12px);
  object-fit: cover;
  border: 3px solid var(--molle-surface, #ffffff);
  box-shadow: var(--molle-shadow, 0 2px 8px rgba(0,0,0,0.08));
}
.molle-guide-header h1 { font-size: 24px; margin: 0; color: var(--molle-text, #2c2c2c); }
.molle-guide-category { color: var(--molle-text-muted, #6b6b6b); font-size: 14px; }
.molle-guide-short { font-size: 18px; color: var(--molle-text-muted, #6b6b6b); margin-bottom: 24px; }
.molle-guide-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}
.molle-guide-gallery img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: var(--molle-radius, 12px);
}
.molle-guide-section { margin-bottom: 32px; }
.molle-guide-section h2 { font-size: 20px; color: var(--molle-primary, #3a6b5e); border-bottom: 2px solid var(--molle-border, #d9d4c8); padding-bottom: 8px; }
.molle-guide-contact, .molle-guide-hours, .molle-guide-facilities { list-style: none; padding: 0; }
.molle-guide-contact li, .molle-guide-hours li { padding: 8px 0; border-bottom: 1px solid var(--molle-border, #d9d4c8); }
.molle-guide-contact a, .molle-guide-facilities a { color: var(--molle-primary, #3a6b5e); }
.molle-guide-facilities li { display: inline-block; background: var(--molle-surface-alt, #f0ece2); padding: 6px 12px; border-radius: 20px; margin: 4px; font-size: 14px; }

@media (max-width: 600px) {
  .molle-card { padding: 20px; }
  .molle-title { font-size: 22px; }
  .molle-guide-header { flex-direction: column; text-align: center; }
  .molle-guide-cover { height: 160px; }
}
