/* MoneyMaker AI – Frontend */

:root{--mm-accent:#4f46e5;}

/* Transparenzhinweis */
.mm-disclosure{font-size:.85em;line-height:1.5;color:#4b5563;background:#f9fafb;border-left:3px solid var(--mm-accent);
  padding:.7em 1em;border-radius:0 8px 8px 0;margin:0 0 1.4em;}

/* KI-Kennzeichen */
.mm-ai-badge{display:inline-flex;align-items:center;gap:.35em;font-size:.72rem;font-weight:600;line-height:1;
  padding:.3em .65em;border-radius:999px;background:#eef2ff;color:#4338ca;border:1px solid #c7d2fe;
  vertical-align:middle;margin-bottom:.8em;}

/* Links und Buttons */
a.mm-link{text-decoration:underline;text-underline-offset:2px;}
a.mm-cta{display:inline-block;padding:.8em 1.6em;border-radius:10px;background:var(--mm-accent);color:#fff !important;
  font-weight:600;text-decoration:none;transition:.15s;}
a.mm-cta:hover{filter:brightness(1.08);}

/* Opt-in */
.mm-optin{border:1px solid #e5e7eb;border-radius:14px;padding:1.6em;background:#fff;
  box-shadow:0 4px 18px rgba(16,24,40,.06);max-width:520px;margin:1.6em 0;}
.mm-optin__title{margin:0 0 .3em;font-size:1.25em;}
.mm-optin__text{margin:0 0 1em;color:#4b5563;font-size:.95em;}
.mm-optin__form{display:grid;gap:.7em;}
.mm-optin input[type=text],.mm-optin input[type=email]{width:100%;padding:.75em .9em;border:1px solid #e5e7eb;
  border-radius:9px;font-size:1em;}
.mm-optin input:focus{outline:none;border-color:var(--mm-accent);box-shadow:0 0 0 3px rgba(79,70,229,.14);}
.mm-optin__consent{display:flex;gap:.6em;align-items:flex-start;font-size:.82em;color:#4b5563;line-height:1.45;}
.mm-optin__consent input{margin-top:.2em;accent-color:var(--mm-accent);}
.mm-optin__hp{position:absolute !important;left:-9999px !important;width:1px !important;height:1px !important;opacity:0;}
.mm-optin__btn{padding:.85em 1.4em;border:none;border-radius:9px;background:var(--mm-accent);color:#fff;
  font-size:1em;font-weight:600;cursor:pointer;}
.mm-optin__btn:hover{filter:brightness(1.08);}
.mm-optin__btn[disabled]{opacity:.6;cursor:wait;}
.mm-optin__msg{font-size:.9em;min-height:1.2em;}
.mm-optin__msg.is-ok{color:#059669;}
.mm-optin__msg.is-error{color:#b91c1c;}

/* Chat */
.mm-chat{position:fixed;bottom:20px;z-index:9998;font-size:15px;}
.mm-chat--right{right:20px;}
.mm-chat--left{left:20px;}
.mm-chat__toggle{width:56px;height:56px;border-radius:50%;border:none;background:var(--mm-accent);color:#fff;
  font-size:24px;cursor:pointer;box-shadow:0 6px 20px rgba(16,24,40,.22);}
.mm-chat__panel{position:absolute;bottom:70px;width:340px;max-width:calc(100vw - 40px);background:#fff;
  border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 12px 38px rgba(16,24,40,.18);overflow:hidden;
  display:flex;flex-direction:column;}
.mm-chat--right .mm-chat__panel{right:0;}
.mm-chat--left .mm-chat__panel{left:0;}
.mm-chat__head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid #e5e7eb;font-size:.95em;}
.mm-chat__head strong{flex:1;}
.mm-chat__close{background:none;border:none;font-size:22px;line-height:1;cursor:pointer;color:#6b7280;}
.mm-chat__log{padding:14px;display:flex;flex-direction:column;gap:10px;max-height:340px;overflow-y:auto;font-size:.92em;}
.mm-chat__msg{padding:.6em .85em;border-radius:12px;max-width:88%;line-height:1.5;}
.mm-chat__msg--bot{background:#f3f4f6;align-self:flex-start;border-bottom-left-radius:4px;}
.mm-chat__msg--user{background:var(--mm-accent);color:#fff;align-self:flex-end;border-bottom-right-radius:4px;}
.mm-chat__msg p{margin:0 0 .5em;}
.mm-chat__msg p:last-child{margin:0;}
.mm-chat__msg a{color:inherit;text-decoration:underline;}
.mm-chat__input{display:flex;gap:8px;padding:12px 14px;border-top:1px solid #e5e7eb;}
.mm-chat__field{flex:1;padding:.6em .8em;border:1px solid #e5e7eb;border-radius:9px;font-size:.95em;}
.mm-chat__field:focus{outline:none;border-color:var(--mm-accent);}
.mm-chat__send{padding:.6em 1em;border:none;border-radius:9px;background:var(--mm-accent);color:#fff;
  font-weight:600;cursor:pointer;font-size:.9em;}
.mm-chat__note{margin:0;padding:0 14px 12px;font-size:.72em;color:#6b7280;line-height:1.4;}
.mm-chat__typing{opacity:.6;font-style:italic;}

@media(max-width:520px){
  .mm-chat__panel{width:calc(100vw - 32px);}
}