:root {
  /* 🎨 Cores */
  --cor-primaria: #00D5FF;        
  --cor-secundaria: #7B7B7B;        
  --cor-texto: rgba(255,255,255,0.88);
  --cor-texto-icons-comment: #F9F9F9;
  --cor-texo-btn-seguir: #FFFFFF;
  --cor-texo-btn-save-post: #FFFFFF;
  --cor-toggle: #7B7B7B;




 
  --cor-fundo-img: url('/static/img/bg-1.webp');
  --cor-texto-forms: #999999;
  --cor-borda-forms: #ffffff07;
  --cor-borda-forms-azul: #03FEFE;
  --cor-borda-image: #03FEFE;
  --bg-forms: #1B1B1B; 
  
  --bg-plus-button: linear-gradient(90deg, #00D5FF 29.8%, #D33686 100%);
  --bg-buttons: #D33686;
  --bg-menu-bottom: rgba(15, 16, 16, 0.49);
  --bg-menu-top: rgb(6 12 37 / 54%);
  --cor-placeholder: #a5a5a5;
  --gradiente-app: radial-gradient(circle,rgba(19, 1, 43, 1) 0%, rgba(9, 0, 21, 1) 50%);
  --gradiente-app-glass: radial-gradient(circle,rgba(19, 1, 43, 0.836) 0%, rgba(9, 0, 21, 0.808) 50%);
  --gradiente-logo: linear-gradient(90deg, #00D5FF 29.8%, #D33686 100%);
  --gradiente-borda-buttons: linear-gradient(to right, #00FF88, #1F8757);
  --gradiente-skeleton: linear-gradient(90deg, #03fefe 1%, #d33686 50%, #03fefe 100%);
  --cor-destaque: #f5f5f5;
  --cor-erro: #ff4d4f;
  --cor-coracao-like-solid: #D33686;
  --cor-coracao-like-reguler: #7B7B7B;
  --cor-icon-svg: #ffffff;
  --buttons-hastag: linear-gradient(90deg, #00D5FF 29.8%, #D33686 100%);
  /* 🖋️ Fontes */
  --fonte-principal: 'Inter', sans-serif;
  --fonte-secundaria: 'Arial', sans-serif;





  /* 🔠 Tamanhos de fonte */
  --fonte-xs: 0.75rem;   /* 12px */
  --fonte-sm: 0.875rem;  /* 14px */
  --fonte-md: 0.950rem;  /* 15px */
  --fonte-lg-small: 1.0rem; /* 16px */
  --fonte-lg: 1.25rem;   /* 20px */
  --fonte-xl: 1.9rem;    /* 24px */
  --fonte-xxl: 2rem;     /* 32px */
  --fonte-logo-xxl: 2rem;     /* 54px */


    /* 🔠 Modal comentarios */
  --fonte-gt-emoji: 1.25rem;   /* 20px */
  --gt-avatar-outside-width: 38px;
  --gt-avatar-outside-height: 38px;
  --comentario-textarea-font-size: 1.0rem; /* 16px */
  --comentario-enviar-btn-width: 38px;
  --comentario-enviar-btn-height: 38px;
  
  /* 📐 Espaçamento */
  --espaco-xs: 4px;
  --espaco-sm: 8px;
  --espaco-md: 16px;
  --espaco-lg: 24px;
  --espaco-xl: 32px;

  /* 🧱 Border radius */
  --borda-pequena: 4px;
  --borda-media: 8px;
  --borda-grande: 16px;
  --borda-forms: 2px;
  --borda-forms-radius: 50px;

  /* 🧱 Sombreamento */
  --sombra-suave: 0px 2px 8px rgba(0, 0, 0, 0.1);
  --sombra-media: 0px 4px 12px rgba(0, 0, 0, 0.2);
  --sombra-forms: 0 0 8px #03fefe;



  /* VARIABLES ATUALIZADO */
  --cor-fundo: #0B0E14;
  --bg-fundo-post: #121622;
  --bg-header-is-sticky: #121622;
  --texto-post: rgba(255,255,255,0.88);
  --cor-title-header:rgba(255,255,255,0.88);
  --cor-full-name: rgba(255,255,255,0.88);
  --cor-username:rgba(255, 255, 255, 0.63);
  --cor-data-post: rgba(255, 255, 255, 0.63);
  --icon-default: rgba(255,255,255,0.88);
  --cor-tab-link-active: rgba(255,255,255,0.88); 
  --cor-icons-default:  rgba(255,255,255,0.88);
  --cor-logo-default:rgba(255,255,255,0.88);
  --cor-reaction-btn: rgba(255,255,255,0.88);
  --cor-head-more: rgba(255, 255, 255, 0.63);
  --cor-hastag-post: #EA646C;
  --bg-nav-menu: #0E121A;
  --bg-plus-button: linear-gradient(180deg, #EA646C 0%, #2226DF 90%);
  
  
  
   /* buttons seguir - seguindo  */
  --bg-fllow-button: #2226DF;
  --bg-button-primary: #2226DF;
  --bg-button-primary-hover: #1B1FC2;
  --cor-text-button-primary:rgba(255,255,255,0.88);
  --cor-text-button-fllow: rgba(255,255,255,0.88);
  --bg-user-card: rgba(255, 255, 255, 0.08);

  --bg-unfollow-button: rgba(255, 255, 255, 0.08);
  --cor-text-button-unfollow: rgba(255, 255, 255, 0.7);

   /* inputs forms icons  */
  --bg-input: #151922;
  --cor-icon-input: rgba(255,255,255,0.88); 
  --cor-placeholder-input: #8B8B8B;
  --cor-text-input:  rgba(255,255,255,0.88);
  --tags-bio-hastags: linear-gradient(180deg, #EA646C 5.2%, #2226DF 100%);

/* chat mensagens  */
--bg-chat-message-received: #121622;
--bg-chat-message-sent: linear-gradient(360deg, #0B0E14 -26.61%, #082153 106.36%);

/* Skeletons notificação - mensagens - seugindo - seguidores */
--skeleton-card: #151922;
--skeleton-avatar:#1d2332;
--skeleton-line-avatar: #1d2332;


/* Skeletons posts */

/* Paleta estilo GPT */
  --sk-bg: #151922;     /* fundo do card */
  --sk-dark: #151922;   /* base */
  --sk-mid:#151922;    /* highlight suave */
  --sk-light: #151922;  /* highlight mais claro */

}
