@import url('profile-panel.css');

/* =========================================================
   DREAM SMS — Brand Theme
   Matches the DREAM SMS logo (glossy black + blue)
   Safe overlay: does not remove/replace any existing layout,
   only re-skins colors, glows and the sidebar branding area.
   ========================================================= */

:root{
 --dream-gold:        #00a968;
 --dream-gold-2:      #007a4d;
 --dream-gold-glow:    rgba(0, 169, 104, 0.55);
 --dream-gold-glow-soft: rgba(0, 169, 104, 0.25);
	--dream-black:        #04060f;
	--dream-black-2:      #0a0d16;
	--dream-black-3:      #10131f;
	--dream-white:        #f3f6fb;
}

/* ---------- Top navbar ---------- */
.navbar-inner{
background: linear-gradient(180deg, #14161f 0%, var(--dream-black-2) 55%, var(--dream-black) 100%) !important;
 border-bottom: 1px solid rgba(0,169,104,0.35);
 box-shadow: 0 1px 12px rgba(0,169,104,0.15);
}

/* ---------- Sidebar ---------- */
#sidebar{
	background: linear-gradient(180deg, var(--dream-black-2) 0%, var(--dream-black) 100%) !important;
 border-right: 1px solid rgba(0,169,104,0.25);
}

.side-nav li a,
.accordion-header a{
	background: linear-gradient(180deg, var(--dream-black-3) 0%, var(--dream-black) 100%) !important;
	color: #cfd8e8 !important;
 border-bottom: 1px solid rgba(0,169,104,0.08) !important;
	transition: all .2s ease;
}

.side-nav li a:hover,
.accordion-header a:hover{
 background: linear-gradient(90deg, rgba(0,169,104,0.18) 0%, rgba(0,169,104,0.02) 100%) !important;
	color: #ffffff !important;
 box-shadow: inset 3px 0 0 var(--dream-gold);
}

.side-nav li.active > a,
.side-nav li a.active{
 background: linear-gradient(90deg, rgba(0,169,104,0.28) 0%, rgba(0,169,104,0.04) 100%) !important;
	color: #ffffff !important;
 box-shadow: inset 3px 0 0 var(--dream-gold), 0 0 12px rgba(0,169,104,0.25);
}

.side-nav li ul li a{
	background: var(--dream-black-2) !important;
}

.side-nav .sidenav-icon .sidenav-link-color{
 background: rgba(0,169,104,0.35) !important;
}
.side-nav li a:hover .sidenav-icon .sidenav-link-color,
.side-nav li.active .sidenav-icon .sidenav-link-color{
	background: var(--dream-gold) !important;
 box-shadow: 0 0 8px var(--dream-gold-glow);
}

/* ---------- Brand / logo area ---------- */
.branding{
	background: none !important;
 border-bottom: 1px solid rgba(0,169,104,0.25);
}
.branding .logo img{
	background: none;
	border-radius: 8px;
	padding: 3px;
	border: none;
	box-shadow: none;
	filter: drop-shadow(0 0 10px var(--dream-gold-glow-soft));
}

/* Admin panel brand badge (square logo mark) */
.brand img{
	background: none;
	border-radius: 10px;
	padding: 3px;
	object-fit: contain;
	border: none;
	box-shadow: none;
	filter: drop-shadow(0 0 10px var(--dream-gold-glow-soft));
}

/* ---------- Buttons ---------- */
.btn-primary,
.btn-info,
button[type="submit"].btn{
 	background: linear-gradient(180deg, var(--dream-gold) 0%, var(--dream-gold-2) 100%) !important;
	border: none !important;
 box-shadow: 0 2px 10px rgba(0,169,104,0.35);
	text-shadow: none !important;
	color: #1a1305 !important;
}
.btn-primary:hover,
.btn-info:hover{
	filter: brightness(1.1);
 box-shadow: 0 2px 16px rgba(0,169,104,0.55);
}

/* ---------- Links / headings accents ---------- */
a{ color: var(--dream-gold); }
a:hover{ color: var(--dream-gold-2); }

.page-header,
h1, h2, h3{
	color: #e8edf7;
}

/* ---------- Panels / widgets ---------- */
.widget-box,
.panel,
.box{
 border-color: rgba(0,169,104,0.12) !important;
}
.widget-title,
.panel-heading{
 	background: linear-gradient(90deg, rgba(22,163,220,0.10) 0%, transparent 100%) !important;
 border-bottom: 1px solid rgba(0,169,104,0.2) !important;
}

/* ---------- Scrollbars ---------- */
::-webkit-scrollbar{ width: 8px; height: 8px; }
::-webkit-scrollbar-track{ background: var(--dream-black-2); }
::-webkit-scrollbar-thumb{ background: var(--dream-gold-2); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover{ background: var(--dream-gold); }

/* ---------- Badges / status ---------- */
.label-success, .badge-success{ background: #00c774 !important; }
.label-important, .badge-important{ background: #ff3860 !important; }
.label-info, .badge-info{ background: var(--dream-gold) !important; color: #1a1305 !important; }

/* ---------- Login screen accent (kept consistent with existing dark login) ---------- */
.dream-brand-mark{
	color: var(--dream-white);
	text-shadow: 0 0 14px var(--dream-gold-glow);
}

/* =========================================================
   DREAM SMS — Blue brand mark (logo + dashboard name)
   The logo file itself is transparent-background; this block makes
   the "DREAM SMS" title match the blue panel identity everywhere.
   ========================================================= */
.brand strong{
 background: linear-gradient(180deg, #e6fff4 0%, #b9f2d7 30%, #00a968 60%, #007a4d 85%, #005238 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
 color: var(--dream-gold);
	font-weight: 900;
	font-style: italic;
	letter-spacing: .01em;
 text-shadow: 1px 1px 0 rgba(0,0,0,.55), 2px 2px 4px rgba(0,0,0,.5), 0 0 16px rgba(0,169,104,.4);
}

.brand span{
 color: rgba(0, 169, 104, 0.75);
}