/* ==========================================================================
   CLOUD FOTOS — tema branco com preto e dourado
   Fundo branco e letras pretas; preto e dourado nos detalhes (menu lateral,
   selo do logo, botões, faixas de destaque).
   Carregado DEPOIS do theme-gold.css (aproveita o logo dourado e os botões).
   ========================================================================== */
html:root {
  color-scheme: light;
  --brand: #c9a227;
  --brand-rgb: 201,162,39;
  --brand-600: #a8861c;
  --brand-light: #e6c45a;
  --brand-soft: #a8861c;
  --brand-text: #6b5310;
  --link: #8a6d12;
  --on-brand: #111;
  --ink: #111111;
  --ink-2: #2b2a27;
  --muted: #6b665c;
  --placeholder: #a39d90;
  --faint: #cfc9bb;
  --line: #e7e3da;
  --line-2: #f3f1ec;
  --line-strong: #d6d0c3;
  --bg: #ffffff;
  --bg-rgb: 255,255,255;
  --panel: #0b0b0b;
  --deep: #0b0b0b;
  --card: #ffffff;
  --card-2: #f7f6f2;
  --input: #ffffff;
  --accent-deep: #111111;
  --accent-deep-2: #2a210c;
  --green: #15803d; --green-50: #e7f5ec;
  --red: #b91c1c;   --red-50: #fdecec;
  --amber: #a16207; --amber-50: #fdf4e3;
  --shadow: 0 1px 2px rgba(17,17,17,.05), 0 4px 16px rgba(17,17,17,.06);
  --shadow-lg: 0 12px 40px rgba(17,17,17,.14);
}

/* Nome da marca: "CLOUD" preto, "FOTOS" dourado mais escuro (legível no branco) */
html:root .brand-name b { color: var(--ink); }
html:root .brand-name span { background: linear-gradient(180deg, #d9b444, #a8861c 60%, #7a5f12); -webkit-background-clip: text; background-clip: text; color: transparent; filter: none; }
html:root .sidebar .brand-name b { color: #fff; }
html:root .sidebar .brand-name span { background: linear-gradient(180deg, #f8e7a8, #d4af37 55%, #a8842a); -webkit-background-clip: text; background-clip: text; filter: drop-shadow(0 0 8px rgba(212,175,55,.4)); }

/* Menu lateral preto com dourado */
html:root .sidebar { background: #0b0b0b; color: #d7cfbf; border-right-color: #1f1d18; }
html:root .sidebar-brand small { background: rgba(212,175,55,.16); color: #e9cf7f; }
html:root .sidebar-nav a.active { background: rgba(212,175,55,.16); color: #fff; box-shadow: inset 3px 0 0 #d4af37; }
html:root .sidebar-nav a.active i { color: #d4af37; }
html:root .sidebar-storage { background: #161512; color: #d7cfbf; }
html:root .sidebar-storage small { color: #9b917e; }
html:root .sidebar-storage .progress { background: #2a261d; }
html:root .sidebar-storage .progress > div { background: #d4af37; }

/* Alertas com texto escuro */
html:root .alert-success { color: #14532d; border-color: #bfe3cc; }
html:root .alert-danger  { color: #7f1d1d; border-color: #f5c2c2; }
html:root .alert-warning { color: #713f12; border-color: #f1dcaa; }
html:root .alert-info    { color: #5a4510; background: #fbf6e6; border-color: #eadba8; }

html:root .modal { background: rgba(17,17,17,.45); }
html:root .table tr:hover td { background: #fbfaf6; }
html:root .icon-btn, html:root .user-chip { background: #fff; }

/* Páginas públicas */
html:root .l-nav nav a.link.active { color: var(--ink); }
html:root .l-top { background: radial-gradient(900px 520px at 78% 30%, rgba(201,162,39,.14), transparent 70%); }
html:root .bg-soft { background: #f7f6f2; border-color: var(--line); }
html:root .hero h1 em { background: linear-gradient(90deg, #c9a227, #8a6d12); -webkit-background-clip: text; background-clip: text; }
/* Logo da página inicial dentro de um cartão preto */
html:root .hero-visual img { background: radial-gradient(circle at 50% 40%, #1c1810, #0b0b0b 70%); border-radius: 32px; padding: 26px; box-shadow: 0 24px 60px rgba(17,17,17,.22), 0 0 0 1px rgba(201,162,39,.4); filter: none; }
html:root .cta { color: #fff; }
html:root .cta .btn { background: linear-gradient(180deg, #e6c45a, #c9a230) !important; color: #111 !important; }
html:root .wa-card .wa-num { color: var(--ink); }
html:root .wa-card { background: radial-gradient(500px 220px at 0% 0%, rgba(37,211,102,.10), transparent), #fff; }
html:root .feature:hover { box-shadow: 0 8px 28px rgba(17,17,17,.08); }
html:root .plan.featured { box-shadow: 0 10px 36px rgba(201,162,39,.25); }