/* GitHub-like theme for the site (inspired, not copied)
   Applied to Bootstrap-based layout in _Layout.cshtml
*/
:root{
  --gh-bg:#f6f8fa;
  --gh-canvas:#ffffff;
  --gh-border:#e1e4e8;
  --gh-text:#24292f;
  --gh-muted:#6a737d;
  --gh-primary:#2e8b57;
  --gh-success:#28a745;
}

html,body{
  height:100%;
  background:var(--gh-bg);
  color:var(--gh-text);
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  font-size:15px;
  line-height:1.5;
}

/* Navbar */
.navbar{
  background:var(--gh-canvas);
  border-bottom:1px solid var(--gh-border);
  box-shadow:none;
}
.navbar .navbar-brand{
  font-weight:700;
  color:var(--gh-text) !important;
  letter-spacing: -0.2px;
}
.navbar .nav-link{
  color:var(--gh-text) !important;
  padding:0.5rem 0.75rem;
}
.navbar .nav-link:hover{ color:var(--gh-primary) !important; }
.navbar .nav-item.active .nav-link{ color:var(--gh-primary) !important; font-weight:600; }

/* Container cards and content */
.container{
  max-width: 980px;
}
.content-wrap{
  /* top padding = header height + nav gap (smaller spacing above content) */
  padding: calc(var(--header-height,72px) + var(--nav-gap,10px)) 1rem 3rem;
}

/* Page cards */
.card{
  background:var(--gh-canvas);
  border:1px solid var(--gh-border);
  border-radius:6px;
}
.card-header{
  background:transparent;
  border-bottom:1px solid var(--gh-border);
  font-weight:600;
}
.card-body{
  color:var(--gh-text);
}

/* Contact info block styles */
.contact-info{ gap:2rem; }
.contact-item{ flex:1; }
.contact-icon{ color: #c8102e !important; margin-bottom:.5rem; }
.contact-label{ font-weight:700; margin-bottom:.25rem; }
.contact-value{ font-size:1.25rem; color:var(--gh-text); text-decoration:none; }
.contact-item a.contact-value{ color:inherit; }
/* Keep email / contact values on a single line */
.contact-value{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Headings */
h1,h2,h3,h4{
  color:var(--gh-text);
  font-weight:600;
}

/* Links and buttons */
a{ color:var(--gh-primary); text-decoration:none; }
a:hover{ text-decoration:underline; }
.btn-primary{
  background-color:var(--gh-primary);
  border-color:var(--gh-primary);
}
.btn-outline-primary{
  color:var(--gh-primary);
  border-color:var(--gh-primary);
}

/* Forms */
.form-control{ border:1px solid var(--gh-border); }
.form-control:focus{ box-shadow:none; border-color:rgba(3,102,214,0.25); }

/* Code blocks and pre */
pre, code{
  font-family: SFMono-Regular, Menlo, Monaco, "Roboto Mono", "Courier New", monospace;
  background:#f6f8fa;
  color:#0b0b0b;
}
pre{ padding:1rem; border-radius:6px; overflow:auto; border:1px solid var(--gh-border); }

/* Tables */
table{
  border-collapse:collapse;
  width:100%;
}
table thead th{ border-bottom:1px solid var(--gh-border); font-weight:600; }
table tbody td{ border-bottom:1px solid #f0f0f0; }

/* Utility: muted text */
.text-muted{ color:var(--gh-muted) !important; }

/* Footer */
footer.site-footer{
  margin-top:2rem;
  padding:2rem 0;
  color:var(--gh-muted);
  text-align:center;
}

/* Responsive tweaks */
@media (max-width:576px){
  .container{ padding-left:1rem; padding-right:1rem; }
  .content-wrap{ padding-top:5.5rem; }
}

/* Small helpers to make the site feel more "GitHub-like" */
.gh-badge{
  display:inline-block; padding:2px 8px; font-size:12px; border-radius:20px;
  background:#f1f8ff; color:var(--gh-primary); border:1px solid rgba(3,102,214,0.12);
}

/* Footer styles matching GitHub look */
.site-footer{
  background: var(--gh-canvas);
}
.site-footer .gh-mark{
  width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:6px; background:#24292f; color:#fff; font-weight:700; margin-right:8px;
}
.site-footer .footer-links{ list-style:none; padding:0; margin:0; }
.site-footer .footer-links a{ color:var(--gh-muted); text-decoration:none; padding:0.25rem 0.5rem; }
.site-footer .footer-links a:hover{ color:var(--gh-primary); }
.site-footer .text-muted{ color:var(--gh-muted) !important; }

/* Make inserted images responsive: scale down on small viewports but keep natural size when possible */
.page-main img,
.content-wrap img,
.card img,
.container img{
  max-width: 100%;
  height: auto;
  width: auto; /* allow natural width up to container width */
  display: block; /* avoid inline gap issues */
  margin-bottom: 2.5rem; /* add spacing below images to separate from text blocks */
}

/* Utility: if you want an image to always fill its container, add class .img-fill */
.img-fill{ width:100%; height:auto; display:block; }

/* Additional spacing rules: ensure paragraphs or headings following images have comfortable gap */
.page-main img + p,
.page-main img + .card-body,
.page-main img + h2,
.page-main img + h3 {
  margin-top: 1.5rem;
}

/* Add spacing when an image appears after text blocks */
.page-main p + img,
.page-main h2 + img,
.page-main h3 + img,
.page-main .card-body + img {
  margin-top: 1.5rem;
}

/* Make the Bootstrap navbar toggler icon a subtle darker color */
.navbar-light .navbar-toggler-icon{ background-image: none; }
.navbar-light .navbar-toggler{ border:1px solid var(--gh-border); }
.navbar-light .navbar-toggler span{
  display:block; width:18px; height:2px; background:var(--gh-muted); margin:4px 0;
}

/* If your layout uses a top-level content placeholder, apply spacing */
.page-main{ padding:1.5rem 0; }

/* New GitHub-like header styles */
.gh-header{
  position:fixed; top:0; left:0; right:0; z-index:1030;
  background:var(--gh-canvas); border-bottom:1px solid var(--gh-border);
}
.gh-header .container{ display:flex; gap:0.75rem; align-items:center; padding:0.5rem 1rem; }
.gh-logo{ color:var(--gh-text); font-size:1rem; display:flex; align-items:center; }
.gh-mark{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:6px; background:#24292f; color:#fff; font-weight:700;
}
.site-logo{ height:32px; max-height:42px; width:auto; border-radius:6px; display:block; }

/* Ensure header retains original compact height by keeping logo inline and removing extra spacing */
.gh-logo img{ display:inline-block; vertical-align:middle; }
.gh-search{ max-width:480px; }
.gh-actions .nav-link{ color:var(--gh-text); }
.gh-actions .avatar{ width:28px; height:28px; background:var(--gh-border); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:var(--gh-muted); font-weight:700; }

.gh-manager-link svg{ vertical-align:middle; }
.gh-manager-link{ color:var(--gh-text); }

.gh-nav-tabs{ --nav-gap:1px; padding:6px 0; }
.gh-nav-tabs .nav{ gap:0.5rem; }
.gh-nav-tabs .nav-link{ color:var(--gh-muted); padding:0.5rem 0.75rem; }
.gh-nav-tabs .nav-link.active{ color:var(--gh-text); font-weight:600; border-bottom:2px solid var(--gh-primary); }

/* Force navigation links to black for desktop nav and header links */
.gh-desktop-nav .nav-link,
.gh-nav-tabs .nav-link,
.gh-header a.nav-link,
.gh-desktop-nav .dropdown-item,
.gh-nav-tabs .dropdown-item {
  color: #000 !important;
}

/* Ensure hover keeps a visible state but prefers black base color */
.gh-desktop-nav .nav-link:hover,
.gh-nav-tabs .nav-link:hover,
.gh-desktop-nav .dropdown-item:hover,
.gh-nav-tabs .dropdown-item:hover {
  color: #c8102e !important; /* hover color: brand red from logo */
}

/* Hamburger / panel (mobile) menu links in black */
.gh-panel .gh-panel-nav a,
.gh-panel .gh-panel-toggle-item,
.gh-panel .gh-panel-sublist a,
.gh-panel .gh-panel-header strong {
  color: #000 !important;
}

.gh-panel .gh-panel-nav a:hover,
.gh-panel .gh-panel-toggle-item:hover,
.gh-panel .gh-panel-sublist a:hover {
  color: #0366d6 !important;
}

/* Riduci lo spazio visivo tra header / menu e il titolo della pagina */
.gh-desktop-nav, .gh-nav-tabs{
  padding-top:0 !important; /* forza rimozione spazio sopra/sotto i tab */
  padding-bottom:0 !important;
  margin-bottom:0 !important;
}

/* Riduci il padding dell'header container per avvicinare ulteriormente il contenuto */
.gh-header .container{ padding-top:0.75rem !important; padding-bottom:0.75rem !important; }

/* Riduci il margine superiore degli heading dentro il contenuto principale */
.page-main h1, .page-main h2{
  margin-top:0 !important;
}

/* Forza il padding-top del contenuto per evitare che variabili o altre regole lo sovrascrivano */
.root-vars {
  /* placeholder for computed layout variables */
}

/* Define a top band between header/nav and content, used to vertically center the page title */
:root {
  /* reduce the vertical band so the page title sits closer to the nav */
  --title-band: calc(var(--header-height,72px) + var(--nav-gap,1px) - 80px);
}

/* Forza il padding-top del contenuto usando la variabile --title-band */
.content-wrap{ padding-top: var(--title-band) !important; }

/* Vertically center first heading between nav and first content block */
.page-main > h1:first-of-type,
.page-main > h2:first-of-type {
  /* pull the first top-level heading further up to reduce gap from the nav
     only when the heading is a direct child of .page-main (avoid affecting
     headings inside cards or panels) */
  margin-top: calc(var(--title-band) / 2 - 1.8em) !important;
  margin-bottom: 0.5rem !important;
  text-align: center;
}

/* Ensure headings inside cards keep normal flow and are not pulled up */
.page-main .card .card-title{
  margin-top: 0 !important;
}

/* Center card titles (e.g. Contatti) */
.card .card-title{
  text-align: center;
  width: 100%;
}

@media (max-width:768px){
  .gh-search{ display:none; }
  .content-wrap{ padding-top:92px; }

  /* Make contact info stack nicely on small screens */
  .contact-info{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:1rem !important;
  }

  .contact-item{
    text-align:left !important;
    display:flex !important;
    align-items:center !important;
    gap:0.75rem !important;
  }

  .contact-icon{ margin-bottom:0 !important; margin-right:.5rem !important; }
  .contact-label{ margin-bottom:0 !important; }
  .contact-value{ white-space:normal !important; }
}

/* Dropdown adjustments for nav posts */
.gh-nav-tabs .dropdown-menu{
  max-height:320px; overflow:auto;
}
.gh-nav-tabs .dropdown-item{ font-size:14px; color:var(--gh-text); }

/* GitHub-style buttons */
.btn-gh{
  display:inline-block; padding:4px 10px; font-size:13px; line-height:1.2;
  color:#24292f; background:#eff3f6; border:1px solid #d1d5da; border-radius:6px;
  text-decoration:none;
}
.btn-gh:hover{ background:#e6edf3; color:var(--gh-text); }
.btn-gh:active{ background:#e1e8ee; }
.btn-gh.btn-sm{ padding:3px 8px; font-size:12px; }

/* Contact form submit hover uses brand red */
.contact-submit{
  background-color:var(--gh-primary);
  border-color:var(--gh-primary);
  color:#fff;
}
.contact-submit:hover{
  background-color:#c8102e !important;
  border-color:#c8102e !important;
}


.page-main h1 {
    margin-top: -60px !important;
}