
/* ==========================================================================
   Sapienza Università di Roma - Dipartimento di Informatica
   Archivio Tesi - Simple & Balanced Column Gutter Override
   ========================================================================== */

/* IMPORTANT: To ensure that scope modification is limited to the Archivio Tesi view, 
all selectors are prefixed with .view-id-archivio_tesi */

/* Set perfectly equal padding (gutters) on ALL columns */
.view-id-archivio_tesi table.table th, 
.view-id-archivio_tesi table.table td {
  padding: 12px 24px !important; /* Uniform 24px left/right padding creates an identical gap between every column */
  vertical-align: middle !important;
}

/* Proportional column distribution (Adds up to exactly 100%) */

.view-id-archivio_tesi table.table th.views-field-value,
.view-id-archivio_tesi table.table td.views-field-value {
  width: 80% !important;           /* Title takes up the majority of the room */
  white-space: normal !important;  /* Forces the title to wrap cleanly at this boundary */
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

.view-id-archivio_tesi table.table th.views-field-value-1,
.view-id-archivio_tesi table.table td.views-field-value-1 {
  width: 10% !important;           /* Course Column */
}

.view-id-archivio_tesi table.table th.views-field-value-3,
.view-id-archivio_tesi table.table td.views-field-value-3 {
  width: 10% !important;           /* Year Column */
}

/* ==========================================================================
   Archivio Tesi - Search Form Inline Alignment
   ========================================================================== */

/* 1. Turn the form into a Flexbox container */
.views-exposed-form#views-exposed-form-archivio-tesi-block-1 {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-end !important; /* Aligns the bottom of the button with the bottom of the input */
  gap: 15px !important;             /* Adds a clean space between the input and the button */
  flex-wrap: wrap !important;       /* Allows them to stack on very small mobile screens */
  margin-bottom: 30px !important;   /* Gives some breathing room before the tables start */
}

/* 2. Remove the default spacing and huge margins added by the Bootstrap theme */
.views-exposed-form#views-exposed-form-archivio-tesi-block-1 .form-group,
.views-exposed-form#views-exposed-form-archivio-tesi-block-1 .form-actions {
  margin: 0 !important; 
}

/* 3. Control the width of the search bar */
.views-exposed-form#views-exposed-form-archivio-tesi-block-1 .form-item-docente {
  flex-grow: 1 !important;    /* Allows the search bar to stretch */
  max-width: 400px !important; /* Prevents it from stretching across the entire monitor */
}

/* ==========================================================================
   Archivio Tesi - Search Input & Button Polish
   ========================================================================== */

/* 1. Make the text box taller, friendlier, and add a transition */
.views-exposed-form#views-exposed-form-archivio-tesi-block-1 input#edit-docente {
  padding: 10px 15px !important;
  border: 2px solid #ced4da !important;
  border-radius: 6px !important;
  font-size: 1rem !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* 2. Brand Focus State (Glows Teal when clicking inside) */
.views-exposed-form#views-exposed-form-archivio-tesi-block-1 input#edit-docente:focus {
  border-color: #005866 !important; /* Department Teal */
  box-shadow: 0 0 0 4px rgba(0, 88, 102, 0.15) !important; /* Soft Teal Glow */
  outline: none !important;
}

/* 3. Make the Button look official and satisfying to click */
.views-exposed-form#views-exposed-form-archivio-tesi-block-1 input#edit-submit-archivio-tesi {
  padding: 10px 24px !important;

  color: #ffffff !important;
  border: none !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  box-shadow: none !important; /* Removes any default gray shadows */
}

/*
TODO:
2. Content Improvements (Via Drupal)

Since you can't change HTML with CSS, here are three things you should absolutely do inside the Drupal Admin panel (in the Views section for archivio_tesi) when you get the chance:

    Change "Applica" to "Cerca": By default, Drupal translates the English "Apply" to "Applica". But for a search box, "Cerca" (Search) is much more intuitive for users. You can change this in the View settings under Advanced -> Exposed Form -> Settings -> Submit button text.

    Add a Placeholder: Right now, the text box is empty. In the View settings for the "Docente" filter, look for the placeholder setting and add something like Es: Amerini, Rossi.... This immediately tells the user what format they should be typing.

    Add an "Azzera" (Reset) Button: If a student searches for a professor, they currently have to manually delete the text to see the full list again. In the Drupal View Exposed Form settings, check the box that says "Include reset button (Include pulsante di reset)". This will automatically generate a second button next to your search button to clear the field.

If you apply that CSS and eventually make those 3 Drupal tweaks, your search section will go from a basic database query form to a highly professional, user-friendly tool!
*/
