/* TrivisMagz macOS-inspired Theme
 * Palette inspired by modern macOS UI: graphite, system blue,
 * violet, pink, orange and green accents with soft glass effects.
 */
:root {
  --mac-blue: #0A84FF;
  --mac-blue-dark: #0067D9;
  --mac-violet: #AF52DE;
  --mac-pink: #FF375F;
  --mac-orange: #FF9F0A;
  --mac-yellow: #FFD60A;
  --mac-green: #30D158;
  --mac-teal: #64D2FF;
  --mac-bg: #F5F5F7;
  --mac-surface: rgba(255,255,255,.86);
  --mac-border: rgba(60,60,67,.18);
  --mac-text: #1D1D1F;
  --mac-muted: #6E6E73;
}

body {
  background-color: var(--mac-bg);
  color: var(--mac-text);
  border-top: 4px solid var(--mac-blue);
}

.main-content-wrapper,
.main-content {
  background: var(--mac-surface);
}

.main-header {
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(245,245,247,.92));
  border-bottom: 1px solid var(--mac-border);
  box-shadow: 0 6px 22px rgba(0,0,0,.06);
}

.logo img {
  max-height: 130%;
  width: auto;
}

.navigation,
.main-menu-wrapper,
.main-menu-wrapper ul,
.ddsmoothmenu ul li a {
  background: linear-gradient(180deg, #1D1D1F 0%, #2C2C2E 100%);
}

.ddsmoothmenu ul li a {
  color: #FFFFFF;
  border-right: 1px solid rgba(255,255,255,.08);
  transition: background .2s ease, color .2s ease;
}

.ddsmoothmenu ul li a:hover,
.ddsmoothmenu ul li ul li a:hover {
  background: linear-gradient(135deg, var(--mac-blue), var(--mac-violet));
  color: #FFFFFF;
}

.breaking-wrapper {
  background: linear-gradient(90deg, var(--mac-orange), var(--mac-pink), var(--mac-violet), var(--mac-blue));
  color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(10,132,255,.18);
}

.breaking-wrapper p b {
  color: #FFFFFF;
}

a,
.post-title a {
  color: var(--mac-blue);
}

a:hover {
  color: var(--mac-violet);
}

.post-title {
  background: linear-gradient(135deg, var(--mac-blue), var(--mac-violet));
  color: #FFFFFF;
  border-radius: 10px 10px 0 0;
}

.post-title a {
  color: #FFFFFF;
}

.tabs-1 {
  border-bottom: 2px solid var(--mac-blue);
}

.tabs-1 a.active,
.tabs-1 a:active {
  background: linear-gradient(135deg, var(--mac-blue), var(--mac-violet));
  color: #FFFFFF;
  border-color: transparent;
}

.pagination a:hover,
.pagination .current {
  background: var(--mac-blue);
  border-color: var(--mac-blue);
  color: #FFFFFF;
}

input,
textarea,
select {
  border: 1px solid var(--mac-border);
  border-radius: 8px;
  background: rgba(255,255,255,.9);
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--mac-blue);
  outline: none;
  box-shadow: 0 0 0 3px rgba(10,132,255,.16);
}

button,
.button {
  background: linear-gradient(135deg, var(--mac-blue), var(--mac-violet));
  border: 0;
  border-radius: 9px;
  color: #FFFFFF;
  box-shadow: 0 4px 12px rgba(10,132,255,.20);
}

button:hover,
.button:hover {
  background: linear-gradient(135deg, var(--mac-violet), var(--mac-pink));
}

.sidebar,
.widget,
.box,
.post,
.content-box {
  border-color: var(--mac-border);
  background: rgba(255,255,255,.78);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  border-radius: 12px;
}

/* macOS-style traffic-light accent where matching elements exist */
.mac-traffic-lights:before {
  content: '●  ●  ●';
  letter-spacing: 5px;
  color: var(--mac-pink);
}

/* Keep legacy image and content dimensions stable */
img { max-width: 100%; height: auto; }